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>缺少所有上述脚本标记.我们已经验证了这些标记中提到的所有文件都在脚本文件夹中.文件夹结构与开发机器上的完全相同.在登台服务器上,web.config fie具有<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).

为了解决这个问题,我改变了我的bundle配置来生成带有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 /类型,并且一切正常.

如果我取消扩展,一切都会中断.这是因为@Scripts和@Styles没有呈现所有必要的属性来理解src到没有扩展名的文件.

Answer 3

通过在捆绑中添加以下行代码进行配置，它对我有用

bundles.IgnoreList.Clear();  

点击链接获取更多说明