C# ASP.NET MVC 4 脚本捆绑在部署时导致错误
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14379130/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
ASP.NET MVC 4 Script bundling causes errors upon deployment
提问by Alex Hope O'Connor
My website is working fine on localhost when @Scripts.Render()is not bundling the scripts however when I deploy to my server the bundled Javascript must contain an error as all Javascript on my page stops working.
我的网站在@Scripts.Render()未捆绑脚本时在 localhost 上运行良好，但是当我部署到我的服务器时，捆绑的 Javascript 必须包含错误，因为我页面上的所有 Javascript 都停止工作。
Here is my bundle code:
这是我的捆绑代码：
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js",
"~/Scripts/jquery-migrate-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
"~/Scripts/jquery.unobtrusive*",
"~/Scripts/jquery.validate*"));
bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
"~/Scripts/jquery-ui-{version}.js",
"~/Scripts/jquery-ui.unobtrusive-{version}.js"));
bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
"~/Scripts/modernizr-*"));
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site.css"));
bundles.Add(new StyleBundle("~/Content/themes/base/css").Include(
"~/Content/themes/base/jquery.ui.core.css",
"~/Content/themes/base/jquery.ui.resizable.css",
"~/Content/themes/base/jquery.ui.selectable.css",
"~/Content/themes/base/jquery.ui.accordion.css",
"~/Content/themes/base/jquery.ui.autocomplete.css",
"~/Content/themes/base/jquery.ui.button.css",
"~/Content/themes/base/jquery.ui.dialog.css",
"~/Content/themes/base/jquery.ui.slider.css",
"~/Content/themes/base/jquery.ui.tabs.css",
"~/Content/themes/base/jquery.ui.datepicker.css",
"~/Content/themes/base/jquery.ui.progressbar.css",
"~/Content/themes/base/jquery.ui.theme.css"));
}
Here is my rendering code:
这是我的渲染代码：
@Styles.Render("~/Content/css")
@Styles.Render("~/Content/themes/base/css")
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/modernizr")
Can someone explain what might be happening to my Javascript upon deployment?
有人可以解释我的 Javascript 在部署时可能会发生什么吗？
Thanks, Alex.
谢谢，亚历克斯。
采纳答案by Ryan Ferretti
You can also change your "new ScriptBundle" to just "new Bundle":
您还可以将“新 ScriptBundle”更改为“新捆绑包”：
bundles.Add(new Bundle("~/bundles/modernizr").Include("~/Scripts/modernizr-*"));
This will bundle your assets without minification. I have run into some cases where minifying just wouldn't work with certain libraries, so this will still allow you to include them in your bundle.
这将捆绑您的资产而不会缩小。我遇到了一些情况，在某些情况下，缩小对某些库不起作用，因此这仍然允许您将它们包含在您的包中。
回答by Fenton
Usually the only difference between debugging and deployed bundles is that optimisations are switched off when you are debugging.
通常调试包和部署包之间的唯一区别是在调试时优化被关闭。
When optimisations are switched on, it is possible for the minification to highlight a syntax error that would be forgiven if there was a line break. For example:
当优化被打开时，缩小有可能突出显示一个语法错误，如果有换行符，该错误将被原谅。例如：
var x = 10
var y = 15
Un-minified, this would probably work - but minified you end up with...
未缩小，这可能会奏效 - 但缩小你最终...
var x = 10 var y = 15 // SyntaxError: missing ; before statement
Which won't work - you need the missing ;characters in there.
这是行不通的——你需要;那里缺少的字符。
If you debug the script, you should be able to see where the error is.
如果您调试脚本，您应该能够看到错误在哪里。
回答by shiroxx
回答by Mica?l Félix
The minification "works" even if that errors appears
即使出现错误，缩小也“有效”
The real solution for this is:
真正的解决方案是：
- Exclude .min and .map files BEFOREyou publish
- 在发布之前排除 .min 和 .map 文件
And the minification will work. In fact, the minification process always works!
缩小将起作用。事实上，缩小过程总是有效的！
If "it works", what is it really going on: why do we have an error?
如果“它有效”，那么它到底发生了什么：为什么我们会出现错误？
ASP.Net seems to use .min files in priority when bundling with enabled optimizations. So it will also integrate any code in .min files and append every javascript file one after another without adding line breaks.
与启用的优化捆绑在一起时，ASP.Net 似乎优先使用 .min 文件。因此，它还会在 .min 文件中集成任何代码，并一个接一个地附加每个 javascript 文件，而不会添加换行符。
It is the browserthat cannot understand why there is a potential comment /* After the min mapping configuration: //# sourceMappingURL=jquery.history.min.js.map Because bundled files will look like:
是浏览器无法理解为什么会有一个潜在的注释 /* 在最小映射配置之后： //# sourceMappingURL=jquery.history.min.js.map 因为捆绑文件看起来像：
[SOMEJAVASCRIPT OF FILEJAVASCRIPT1 HERE;]
//# sourceMappingURL=jquery.history.min.js.map /* begin of a comment of FILEJAVASCRIPT2 appended (in the bundle) javascript file */
There are two solutions to avoid that error:
有两种解决方案可以避免该错误：
- Create separate bundles for the javascript files that can't follow (it's like not activating the bundling feature).
- Create a bundle that will not enable minification (bad)
- Or an alternative: exlude all minified files or the min.js files that have a sourceMappingURL (or change their source) and .map files
- 为无法跟随的 javascript 文件创建单独的捆绑包（就像没有激活捆绑功能）。
- 创建一个不会启用缩小的包（坏）
- 或者替代方案：排除所有缩小的文件或具有 sourceMappingURL（或更改其源）和 .map 文件的 min.js 文件
The goal would be to force ASP.Net to regenerate min files by itself (and ASP.Net will not make //sourceMappingUrl inside its generated file so it will fix that problem).
目标是强制 ASP.Net 自行重新生成最小文件（并且 ASP.Net 不会在其生成的文件中生成 //sourceMappingUrl，因此它将解决该问题）。
So the real problem is the current implementation of this feature inside the browsers because it cannot seem to parse comments for the comment of sourcemapping. Maybe there's another way to indicate the browser that the sourceMappingUrl has ended.
所以真正的问题是当前浏览器中这个特性的实现，因为它似乎无法解析 sourcemapping 的注释。也许还有另一种方式来指示浏览器 sourceMappingUrl 已经结束。
