ASP.NET MVC Bundle 未在登台服务器上呈现脚本文件。 它适用于开发服务器

Question

在我们的 ASP.NET MVC 4 Web 应用程序中，我们的 BundleConfig.cs 包括以下内容：

bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/Scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/Scripts/jquery-ui-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/Scripts/jquery.unobtrusive*",
                        "~/Scripts/jquery.validate*"));
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/Scripts/modernizr-*"));

当我们在开发服务器上查看主页的 html 时，我们可以看到以下脚本标记，即使 web.config 中的调试模式设置为 true 作为<compilation debug="true" targetFramework="4.0" /> ：

<script src="/AFR/Scripts/jquery-ui-1.8.20.min.js"></script>
<script src="/AFR/Scripts/modernizr-2.5.3.js"></script>
<script src="/AFR/Scripts/jquery-1.7.1.js"></script>
<script src="/AFR/Scripts/jquery-ui-1.8.20.js"></script>
<script src="/AFR/Scripts/jquery.unobtrusive-ajax.js"></script>
<script src="/AFR/Scripts/jquery.validate.js"></script>
<script src="/AFR/Scripts/jquery.validate.unobtrusive.js"></script>

但是当我们在登台服务器上部署应用程序并查看主页的 html（查看源代码）时，除了<script src="/AFR/Scripts/jquery-ui-1.8.20.min.js"></script>之外的所有上述脚本标记<script src="/AFR/Scripts/jquery-ui-1.8.20.min.js"></script>缺失。 我们已经验证了这些标签中提到的所有文件都在脚本文件夹中。 文件夹结构与开发机器上的完全相同。 在临时服务器上，web.config 文件具有<compilation targetFramework="4.0" /> ，这意味着默认情况下是 debug="false"。

因此，某些 JavaScript 函数在登台服务器上失败。 登台机器和开发机器都是 Windows 2012。

请帮忙。 谢谢。

Answer 1

根据您的评论，我们需要了解Bundling机制在 MVC 中的工作方式。

编辑：根据VSDev下面的评论，您需要确保WebGrease安装到您的项目中。 NuGet最简单的方法就是安装这个包。

当您设置捆绑配置时（示例不是上面的说明）

bundles.Add(new ScriptBundle("~/bundles/mainJs")
      .Include("~/Scripts/mainSite.js")
      .Include("~/Scripts/helperStuff.js"));

然后，在您的视图中，调用类似@Scripts.Render("~/bundles/mainJs") 。 当您的 web.config 设置为调试编译时，或者您在BundleConfig.cs文件中使用以下行明确关闭捆绑

BundleTable.EnableOptimizations = false;

然后，在您的视图中，您将看到以下呈现的内容

<script src="/Scripts/mainSite.js" type="text/javascript"></script>
<script src="/Scripts/helperStuff.js" type="text/javascript"></script>

这些是组成我们的捆绑包的单个项目，未压缩并单独列出。 这些在调试模式下单独列出的原因是，您可以调试脚本并在编写脚本时查看它们（实际变量名称等）。

现在，当我们不在调试编译中并且没有关闭EnableOptimizations功能时，MVC 将在我们的包中组合这些文件，压缩（缩小）它们并仅输出单个脚本标记。

<script src="/bundles/mainJs?v=someBigLongNumber" type="text/javascript"></script>

请注意，源与包配置中的包名称相同。 此外，每当您更改该包中的文件时， ?v=后面的数字都会更改。 这是为了帮助防止客户端浏览器缓存旧的 js 和 css 文件。

您的脚本仍然存在并正在输出，但它们正在被压缩并组合成一个名为/bundles/mainJs文件。 此功能存在于

A)压缩文件并减少传输的信息，

B)减少调用网站以检索呈现页面所需的内容的次数。

什么都没有丢失，听起来一切都按预期工作。 在生产站点中，缩小使这些文件几乎无法读取，因此为什么在调试时缩小不生效。

至于为什么 jQuery UI 仍然是单个 JS 文件，请确保没有人将其硬编码到您的布局视图中。 至于 JS 错误，可能是您的开发框中存在的错误，也可能是某些内容没有正确压缩（但是，在我的所有 MVC 开发中，由于缩小错误，我还没有看到 JS 错误）。

Answer 2

我遇到了同样的问题，我不知道为什么，但结果是 Scripts.Render 生成的脚本链接没有 .js 扩展名。 因为它也没有 Type 属性，所以浏览器无法使用它（chrome 和 firefox）。

为了解决这个问题，我更改了我的包配置以生成带有 js 扩展名的编译文件，例如

            var coreScripts = new ScriptBundle("~/bundles/coreAssets.js")
            .Include("~/scripts/jquery.js");

        var coreStyles = new StyleBundle("~/bundles/coreStyles.css")
            .Include("~/css/bootstrap.css");

注意new StyleBundle(...而不是说~/bundles/someBundle ，我说的是~/bundlers/someBundle.js或~/bundles/someStyles.css ..

这会导致在启用优化时在 src 属性中生成的链接具有 .js 或 .css ，因此浏览器根据文件扩展名知道要在 get 请求中使用什么 mime/type 并且一切正常。

如果我取消扩展，一切都会中断。 那是因为@Scripts 和@Styles 没有将所有必要的属性渲染为一个没有扩展名的文件来理解 src。

Answer 3

通过在 bundle 中添加以下行代码来配置它对我有用

bundles.IgnoreList.Clear();  

点击链接获取更多解释

Answer 4

对我来说，修复是将 System.Web.Optimization 的版本升级到 1.1.0.0 当我在 1.0.0.0 版本时，它永远不会解析子目录中的 .map 文件（即正确缩小和捆绑子目录中的脚本）

Answer 5

每当我在 web.config 中设置 debug="off" 并运行我的 mvc4 应用程序时，我最终都会...

<script src="/bundles/jquery?v=<some long string>"></script>

在我的 html 代码和 JavaScript 错误中

Expected ';'

有两种方法可以摆脱 javascript 错误

1. 在 BundleConfig.cs 中设置BundleTable.EnableOptimizations = false

或者

2. 我最终使用 NuGet 包管理器来更新 WebGrease.dll。 无论是 debug="true" 还是 debug="false"，它都能正常工作。

Answer 6

我使用了 Identity2，然后脚本没有为匿名用户加载，然后我在webconfig和 Sloved 中添加了这段代码。

<location path="bundles">
<system.web>
  <authorization>
    <allow users="*" />
  </authorization>  
</system.web>
 </location>

Answer 7

启用捆绑优化时要检查的事项；

BundleTable.EnableOptimizations = true;

和

webconfig debug = "false"

---

1. bundles.IgnoreList.Clear();

这将忽略包的缩小资产，如*.min.css或*.min.js ，这可能会导致脚本的未定义错误。 修复是用原始资产替换.min资产。 如果你这样做，你可能不需要bundles.IgnoreList.Clear(); 例如

bundles.Add(new ScriptBundle("~/bundles/datatablesjs")
       .Include("~/Scripts/datatables.min.js") //<-- change and point this to your (original) non minified ver.

2. 确保 css 和 js 包的名称是唯一的。

bundles.Add(new StyleBundle("~/bundles/datatablescss").Include( ...) );

bundles.Add(new ScriptBundle("~/bundles/datatablesjs").Include( ...) );

3. 确保你使用的 @Script.Render 和 Style.Render 的渲染名称在你的包配置上是相同的。 例如

@Styles.Render("~/bundles/datatablescss")

@Scripts.Render("~/bundles/datatablesjs")

Answer 8

将此操作添加到您的全局文件中。

protected void Application_Start() {
   BundleConfig.RegisterBundles(BundleTable.Bundles);
}