Bundle.config 对调试、发布和缩小感到困惑 [英] Bundle.config confused about debug and release and minification

问题描述

我阅读了这篇文章 http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification，我只是觉得其中缺少很多内容.

I read this article http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification and I just feel there's a lot of content missing from it.

我正在使用未缩小的 javascript 文件开发一个项目.然而，当我决定将我的项目发布到另一台服务器时，这变成了一个问题，其中 bundle.config 劫持了我的 javascript 文件并做了一些我从来不知道我需要对我的开发进行测试的事情，现在我的开发机器正在抛出各种JavaScript 错误.所以现在，我在这里，阅读 bundle.config 对最小文件的作用.

I was developing on a project using unminified javascript files. However, this became an issue when I decided to publish my project to another server, where bundle.config hijacks my javascript files and does things I never knew that I needed to test on my development, and now my dev machine is throwing all kinds of javascript errors. So now, I'm here, reading up on what bundle.config does with min files.

看完这篇文章，我做了以下假设:

After reading the article, I made the following assumptions:

如果我将我的项目设置为调试模式，我的项目将获得所有不包含任何min.js"文件的 javascript 文件.

If I set my project to debug mode, my project will get all javascript files that does not contain any "min.js" files.

如果我将我的项目设置为发布模式，我的项目将尝试获取我所有的 min.js 文件，如果没有 min.js 文件，那么非 min 文件将被转换为缩小版本.

if I set my project to release mode, my project will attempt to get all my min.js files, and if there are no min.js files, then the non-min files will be converted to a minified version.

基于这两个假设，结果证明我错了.切换到发布模式对最小文件没有任何作用，它的作用与我的调试模式相同.

Based on those two assumptions, turns out I was wrong. Switching to Release mode doesn't do anything with min files, it acts the same way as my Debug mode.

其次，进入 web.config 并将以下内容设置为 false(以前为 true):

Secondly, going into the web.config and setting the following to false (previously true):

<compilation debug="false" /> 

获取我所有未缩小的文件并缩小它们，忽略我拥有的任何最小文件！我没有看到关于 File.min.js 的任何内容，我看到的只是:File?v=dw-fikdksdm..."这很好，因为这被认为是一个捆绑包"并且被缩小了，但是为什么我不能只看到我的分钟加载?如果缩小和捆绑会引发 javascript 错误，会发生什么?这个时候我该怎么办?我可以防止某些 javascript 文件不包含在包中和/或缩小吗?

takes all my files that are not minified and minifies them, ignoring any min files I have! I don't see anything about File.min.js, all I see is something like: "File?v=dw-fikdksdm..." which is fine, since this is considered a "bundle" and gets minified, but why can't I just see my mins loaded? and what happens if minification and bundling throws javascript errors? What would I have to do at this point? Can I prevent some javascript files from not being included in a bundle and/or minified?

我还注意到在尝试加载 javascript 资源时发生了几个 403 错误.

Also I've noticed there are a couple of 403 errors that occur when tried to load up the javascript resources.

有人可以解释一下这里发生了什么以及为什么这与我最初的假设相悖吗?

Can someone explain what's going on here and why this is goes against my original assumption?

推荐答案

好的，以下是我发现的一些事情:

Okay, here are a few things I discovered about this:

在调试模式下，您检查 web.config:

When in debug mode, and you check the web.config:

 <system.web>
     <compilation debug="true">

那么您所有的 javascript 都将保留在捆绑虚拟目录中(它们不会合并到单个文件中，并且不会被缩小).

then all your javascripts will be preserved within the bundle virtual directory (they will not merge into a single file and they will not be minified).

切换到释放模式时，再切换到:

When switching to release mode, then switch to:

 <system.web>
     <compilation debug="false">

这样你在一个包中的所有 javascript 文件都被缩小并编译成一个文件，这减少了到网络的往返.请注意，为每个捆绑包创建一个文件.

so that all your javascript files within a bundle are minified and compiled into a single file, this reduces round trips to the network. Please note, one file is created for each bundle.

如果无论您是否处于调试模式都想启用优化，请设置 BundleTable.EnableOptimizations = true，这会强制缩小和捆绑.如果您将其从代码中删除，BundleConfig 将改为查看 web.config.

If you want to get the optimizations enabled regardless of whether or not you're in debug mode, then set BundleTable.EnableOptimizations = true, which forces the minification and bundling. If you leave this out of the code, then BundleConfig will look at the web.config instead.

RegisterBundles(BundleCollection bundles) method in BundleConfig.cs, you put in:

    BundleTable.EnableOptimizations = true;
    bundles.UseCdn = true;
    var cssTransformer = new CssTransformer();
    var jsTransformer = new JsTransformer();
    var nullOrderer = new NullOrderer();

这就是您添加 javascript 文件的方式:

and this is how you'd add in javascript files:

    var jqueryBundle = new CustomScriptBundle("~/bundles/jquery");
    jqueryBundle.IncludeDirectory("~/Scripts/JQuery", "*.js");
    jqueryBundle.Transforms.Add(jsTransformer);
    jqueryBundle.Orderer = nullOrderer;
    bundles.Add(jqueryBundle);

情侣注意事项:

• Bundle.config 会忽略所有最小文件.我添加了 File.min.js 和 File.js，它忽略了 File.min.js，它缩小了 File.js 并将它与包中包含的其他文件捆绑在一起.我检查是因为当我自己缩小其中一个文件时，与我网站上下载的内容相比，所有变量名称(不是结构化代码)与我包含在项目中的 min 文件完全不同.因此，这验证了您的项目中不需要最小文件.
• Bundle.config 会忽略任何类似这样命名的文件的缩小.File.debug.js"，它永远不会被缩小，事实上，它永远不会被包含在你的项目中.我在意识到我的一个 javascript 文件从未进入网站后发现了这一点.

• 如果您使用Content/css"作为您的包将出现的虚拟目录，则会发生 403 错误，这需要更改为bundles/css"并且 403 将像这样消失(使用剃刀):

• Bundle.config does ignore all min files. I added File.min.js, and File.js, and it ignores File.min.js, and it minifies File.js and bundles it with other files included in the bundle. I checked because when I minified one of the files myself, all the variable names (not the structured code) compared to what was downloaded in my website was completely different than the min file I included in the project. So, this verifies that min files are not needed in your project.
• Bundle.config ignores minifying any files named like this.. "File.debug.js", this will never be minified, in fact, it will never be included in your project in release. I found this out after realizing one of my javascript files never making it to the site.

• 403 errors will occur if you use "Content/css" as your virtual directory of where your bundle will appear, this needs to be changed to "bundles/css" and the 403 will go away like so (using razor):

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

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

意思是如果你的代码中有这个(注意 ~/bundle/css" 在哪里，这将是你的 css 文件所在的位置):

meaning if you have this in your code (notice where ~/bundle/css" is, this will be where your css files will go):

BundleTable.EnableOptimizations = true;

bundles.UseCdn = true;
var cssTransformer = new CssTransformer();
var jsTransformer = new JsTransformer();
var nullOrderer = new NullOrderer();
#region CSS Styles
var cssBundle = new CustomStyleBundle("~/bundles/css");
cssBundle.IncludeDirectory("~/Content/CSS", "*.css")
         .IncludeDirectory("~/Content/CSS/Override", "*.css");
cssBundle.Transforms.Add(cssTransformer);
cssBundle.Orderer = nullOrderer;
bundles.Add(cssBundle);
#endregion

• 如果你的 css 有相对路径，这个也有可能会改变，所以寻找 404 错误
• 并非所有缩小的文件都会按照您希望的方式运行..所以您最终必须做一个半捆绑版本(或者您根本不必缩小任何 js，只需将它们捆绑即可)

但是如果您想继续执行缩小的 javascript 并且您不知道哪些文件引发了错误，以下步骤将有所帮助:

But if you want to continue on doing the minified javascript and you do not know which files is throwing the error, the following steps will help:

1. 捆绑一切
2. 打开你的浏览器，找到你打包的压缩 js 的所有来源
3. 将工作捆绑的 js 复制到另一个文件中
4. 开始使用标签而不是 bundleconfig.cs 手动插入 javascript，并继续一个一个地添加它们，直到一个失败.. 如果失败.. 那么你必须使用该项目的未缩小版本
5. 重复步骤 3-4

我希望在撰写本文时有更好的 bundle.config 文档，但我发现整个体验非常令人失望.

I wish there was better documentation of bundle.config at the time of this writing, but I found this entire experience to be severely disappointing.

这篇关于Bundle.config 对调试、发布和缩小感到困惑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！