Question

我正在尝试使用Microsoft Web Optimization framework将大量.js文件连接到一个文件中。一切正常，但在这些文件中，我有几个已经缩小的＆amp; uglified并且不需要再次处理它们。

例如，我有recaptcha_ajax.js文件，并在附加时导致以下错误：

/* Minification failed. Returning unminified contents.
(715,29-36): run-time error JS1019: Can't have 'break' outside of loop: break t
(714,293-300): run-time error JS1019: Can't have 'break' outside of loop: break t
(678,210-217): run-time error JS1019: Can't have 'break' outside of loop: break t
(671,1367-1374): run-time error JS1019: Can't have 'break' outside of loop: break t
(665,280-287): run-time error JS1019: Can't have 'break' outside of loop: break t
 */

我试图从包中取出recaptcha_ajax.js并直接引用它，但是弹出其他错误 - 所以，我需要在某个位置的包内的那个文件。

我只需要能够说 - 不要缩小＆amp; uglify recaptcha_ajax.js - 只需将其添加到捆绑包中。

有办法做到这一点吗？我就是这样看的：

var b = new ScriptBundle("~/bundles/myjsbundle");

b.IncludeDirectory("~/ScriptsMine/", "*.js", true);

// some command like:
// b.DoNotMinifyOrUglify("~/ScriptsMine/recaptcha_ajax.js");

bundles.Add(b);

Answer 1

Bundles使用IItemTransform的集合转换每个文件并连接结果。然后，它使用IBundleTransform。

的集合转换结果

默认脚本包使用JsMinify（实现IBundleTransform）缩小完整的包内容。

因此，为了防止某些文件缩小，您必须创建自己的IBundleBuilder，使用IItemTransform按文件缩小捆绑文件。

public class CustomScriptBundle : Bundle
{
    public CustomScriptBundle(string virtualPath)
        : this(virtualPath, null)
    {
    }

    public CustomScriptBundle(string virtualPath, string cdnPath)
        : base(virtualPath, cdnPath, null)
    {
        this.ConcatenationToken = ";" + Environment.NewLine;
        this.Builder = new CustomBundleBuilder();
    }
}


public class CustomBundleBuilder : IBundleBuilder
{
    internal static string ConvertToAppRelativePath(string appPath, string fullName)
    {
        return (string.IsNullOrEmpty(appPath) || !fullName.StartsWith(appPath, StringComparison.OrdinalIgnoreCase) ? fullName : fullName.Replace(appPath, "~/")).Replace('\\', '/');
    }

    public string BuildBundleContent(Bundle bundle, BundleContext context, IEnumerable<BundleFile> files)
    {
        if (files == null)
            return string.Empty;
        if (context == null)
            throw new ArgumentNullException("context");
        if (bundle == null)
            throw new ArgumentNullException("bundle");

        StringBuilder stringBuilder = new StringBuilder();
        foreach (BundleFile bundleFile in files)
        {
            bundleFile.Transforms.Add(new CustomJsMinify());
            stringBuilder.Append(bundleFile.ApplyTransforms());
            stringBuilder.Append(bundle.ConcatenationToken);
        }

        return stringBuilder.ToString();
    }
}

public class CustomJsMinify : IItemTransform
{
    public string Process(string includedVirtualPath, string input)
    {
        if (includedVirtualPath.EndsWith("min.js", StringComparison.OrdinalIgnoreCase))
        {
            return input;
        }

        Minifier minifier = new Minifier();
        var codeSettings = new CodeSettings();
        codeSettings.EvalTreatment = EvalTreatment.MakeImmediateSafe;
        codeSettings.PreserveImportantComments = false;

        string str = minifier.MinifyJavaScript(input, codeSettings);

        if (minifier.ErrorList.Count > 0)
            return "/* " + string.Concat(minifier.Errors) + " */";

        return str;
    }
}

然后使用CustomScriptBundle代替ScriptBundle

public static void RegisterBundles(BundleCollection bundles)
{
    bundles.Add(new CustomScriptBundle("~/bundles/Sample").Include(
                "~/Scripts/a.js",
                "~/Scripts/b.js",
                "~/Scripts/c.js"));
}

如果您提供min.js文件，则会使用该文件而非缩小文件。

Answer 2

优化框架考虑了文件名。

尝试将您的* .js文件重命名为recaptcha_ajax.min.js。如果我是正确的，那么它应该跳过uglify / minify进程。

参考数据：http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification （向下滚动一下，找到这个引用：）

上述代码创建了一个名为的新JavaScript包   〜/ bundles / jquery包含所有适当的（即debug或   Scripts文件夹中与...匹配的缩小但不是.vsdoc文件   外卡字符串＆＃34;〜/ Scripts / jquery- {version} .js＆＃34;。对于ASP.NET MVC 4，   这意味着使用调试配置，文件jquery-1.7.1.js将   被添加到包中。在发布配置中，   将添加jquery-1.7.1.min.js。捆绑框架如下   几个常见的惯例，如：


当“FileX.min.js”和“FileX.js”存在时，选择“.min”文件进行发布。

选择非“.min”版本进行调试。

忽略仅由IntelliSense使用的“-vsdoc”文件（例如jquery-1.7.1-vsdoc.js）。

Answer 3

如果要在ScriptManager中捆绑.js文件，您会注意到脚本已加载到<form>，而不是<head>，因此将其从捆绑包中拉出会将该文件加载到其他文件之前，如果它依赖于捆绑中的其他东西，这是不好的

以下是需要按特定顺序添加到捆绑包中的库的示例这已添加到App_Start / BundleConfig.vb

'############################################################
' This is a ScriptManager Resource Definition 
' for use in a ScriptManager mapping
'############################################################
    Dim ResourceDef as ScriptResourceDefinition = New ScriptResourceDefinition()
    Dim ResourceName as  String = "ColorBox"

    'add the Resource Definition details
    ResourceDef.Path = "~/Scripts/colorbox/jquery.colorbox-min.js"
    ResourceDef.DebugPath = "~/Scripts/colorbox/jquery.colorbox.js"

    ScriptManager.ScriptResourceMapping.AddDefinition(ResourceName, ResourceDef)
'############################################################

请注意ResourceDef.Path和ResourceDef.DebugPath的使用。包含哪个文件取决于您进行调试或发布发布

调试：否＆＃34; uglification＆＃34;
发布：总计＆＃34; uglification＆＃34;

这是我的ScriptManager包，注意ColorBox的位置，位置意味着很多：

<asp:ScriptManager runat="server" >
    <Scripts>
        <asp:ScriptReference Name="jquery" />
        <asp:ScriptReference Name="jquery.ui.combined" />
        <asp:ScriptReference Name="ColorBox" />          
        <asp:ScriptReference Name="Infragistics" /> 
        <asp:ScriptReference Name="MsAjaxBundle" />
        <asp:ScriptReference Name="WebForms.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebForms.js" />
        <asp:ScriptReference Name="WebUIValidation.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebUIValidation.js" />
        <asp:ScriptReference Name="MenuStandards.js" Assembly="System.Web" Path="~/Scripts/WebForms/MenuStandards.js" />
        <asp:ScriptReference Name="GridView.js" Assembly="System.Web" Path="~/Scripts/WebForms/GridView.js" />
        <asp:ScriptReference Name="DetailsView.js" Assembly="System.Web" Path="~/Scripts/WebForms/DetailsView.js" />
        <asp:ScriptReference Name="TreeView.js" Assembly="System.Web" Path="~/Scripts/WebForms/TreeView.js" />
        <asp:ScriptReference Name="WebParts.js" Assembly="System.Web" Path="~/Scripts/WebForms/WebParts.js" />
        <asp:ScriptReference Name="Focus.js" Assembly="System.Web" Path="~/Scripts/WebForms/Focus.js" />
        <asp:ScriptReference Name="WebFormsBundle" />
    </Scripts>
</asp:ScriptManager>

使用Microsoft Web Optimization Framework时，请不要使用某些文件

3 个答案: