MVC5 捆绑包不适用于某些资源
MVC5 bundles does not work for some resources
这很好奇。我在 BundleConfig.cs:
中有这些捆绑包
bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/font-awesome.css",
"~/Content/nprogress.css",
"~/Content/iCheck/flat/green.css",
"~/Content/daterangepicker.css",
"~/Content/bootstrap-dialog.css",
"~/Content/Tooltipster/css/tooltipster.css",
"~/Content/custom.css"));
bundles.Add(new ScriptBundle("~/bundles/gentelella").Include(
"~/Scripts/fastclick.js",
"~/Scripts/nprogress.js",
"~/Scripts/jquery.icheck.js",
"~/Scripts/date.js",
"~/Scripts/moment-with-locales.js",
"~/Scripts/daterangepicker.js",
"~/Scripts/validator/validator.js",
"~/Scripts/bootstrap-dialog.js",
"~/Scripts/jquery.tooltipster.js",
"~/Scripts/custom.js"));
看到我有 CSS 包和脚本包。特别查看两个包中的最后一个,custom.css 和 custom.js.
奇怪的是,在所有文件中,只有 custom.css 和 custom.js 在发布网站时没有呈现。当我调试时,一切正常。问题只发生在生产现场。
custom.css 和 custom.js 都没有最小化。可以看到自定义csshere and custom.js here.
渲染时,所有 CSS 都加载了这个 URL:http://demo.relojelectronico.cl/Content/css?v=l7FFCONJaEcRHBZMIAQIwzM3XkNczNlgWBYwjHtrumM1
并且所有 JS 都呈现为:http://demo.relojelectronico.cl/bundles/gentelella?v=vBQcZjDbD_j0oRIktzJoqND9pbeEqe-jNtQFHZ9YfMM1
任何帮助将不胜感激。
编辑:
我注意到 CSS 文件已正确呈现。问题只是 custom.js.
为了测试它,我将它分开捆绑,这样:
bundles.Add(new ScriptBundle("~/bundles/custom").Include(
"~/Scripts/custom.js"
));
这样,您就可以看到捆绑版本here。
奇怪的是,原始 JS 以以下内容开头:
/**
* Resize function without multiple trigger
*
* Usage:
* $(window).smartresize(function(){
* // code here
* });
*/
(function ($, sr) {
// debouncing function from John Hann
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
var debounce = function (func, threshold, execAsap) {
var timeout;
return function debounced() {
var obj = this, args = arguments;
function delayed() {
if (!execAsap)
func.apply(obj, args);
timeout = null;
}
if (timeout)
clearTimeout(timeout);
else if (execAsap)
func.apply(obj, args);
timeout = setTimeout(delayed, threshold || 100);
};
};
// smartresize
jQuery.fn[sr] = function (fn) { return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); };
})(jQuery, 'smartresize');
/**
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/
var CURRENT_URL = window.location.href.split('#')[0].split('?')[0],
$BODY = $('body'),
$MENU_TOGGLE = $('#menu_toggle'),
$SIDEBAR_MENU = $('#sidebar-menu'),
$SIDEBAR_FOOTER = $('.sidebar-footer'),
$LEFT_COL = $('.left_col'),
$RIGHT_COL = $('.right_col'),
$NAV_MENU = $('.nav_menu'),
$FOOTER = $('footer');
// Sidebar
function init_sidebar() {
// TODO: This is some kind of easy fix, maybe we can improve this
var setContentHeight = function () {
// reset height
$RIGHT_COL.css('min-height', $(window).height());
var bodyHeight = $BODY.outerHeight(),
footerHeight = $BODY.hasClass('footer_fixed') ? -10 : $FOOTER.height(),
leftColHeight = $LEFT_COL.eq(1).height() + $SIDEBAR_FOOTER.height(),
contentHeight = bodyHeight < leftColHeight ? leftColHeight : bodyHeight;
// normalize content
contentHeight -= $NAV_MENU.height() + footerHeight;
$RIGHT_COL.css('min-height', contentHeight);
$RIGHT_COL.css('height', contentHeight);
};
(我刚刚放置了它的开头)。正如您所注意到的,当创建捆绑包时,它从 init_sidebar 函数开始。 JS 文件中的许多函数也会发生同样的情况。它们在捆绑后从文件中删除。
这怎么可能?
我测试过 BundleTable.EnableOptimizations = false;在 BundleConfig 中,这样 custom.js 按原样呈现。仅在优化时出现此问题。
尝试添加
<add name="BundleModule" type="System.Web.Optimization.BundleModule" />
在网络配置中 <modules> under <system.webServer>.
有用link:Why is my CSS bundling not working with a bin deployed MVC4 app?
我回答我的问题是否能帮助其他人解决这个问题。
这没有记录,但我发现了问题所在。
事实证明,在两个文件夹(内容和脚本)中存在 custom.css 和 custom.js 的缩小版本(名称分别为 custom.min.css 和 custom.min.js ).那些缩小版本不是custom.css和custom.js对应的缩小版本,而是原始版本。
所以,我使用了一个在线压缩器 (for CSS and for JS) 并替换了该网站的最小版本,并且成功了。
这是结论。当在 ASP.NET MVC 中启用优化时,优化器首先查找等效的“.min”。如果文件存在于文件夹中。如果是,则将该文件发送到浏览器。如果没有,它会执行缩小。
这可能也是“.min.”的原因。文件的版本被添加到捆绑中,它不起作用,文件根本没有发送。
也许所有这些都记录在某处,但我没有找到。
干杯,
海梅
这很好奇。我在 BundleConfig.cs:
中有这些捆绑包 bundles.Add(new StyleBundle("~/Content/css").Include(
"~/Content/bootstrap.css",
"~/Content/font-awesome.css",
"~/Content/nprogress.css",
"~/Content/iCheck/flat/green.css",
"~/Content/daterangepicker.css",
"~/Content/bootstrap-dialog.css",
"~/Content/Tooltipster/css/tooltipster.css",
"~/Content/custom.css"));
bundles.Add(new ScriptBundle("~/bundles/gentelella").Include(
"~/Scripts/fastclick.js",
"~/Scripts/nprogress.js",
"~/Scripts/jquery.icheck.js",
"~/Scripts/date.js",
"~/Scripts/moment-with-locales.js",
"~/Scripts/daterangepicker.js",
"~/Scripts/validator/validator.js",
"~/Scripts/bootstrap-dialog.js",
"~/Scripts/jquery.tooltipster.js",
"~/Scripts/custom.js"));
看到我有 CSS 包和脚本包。特别查看两个包中的最后一个,custom.css 和 custom.js.
奇怪的是,在所有文件中,只有 custom.css 和 custom.js 在发布网站时没有呈现。当我调试时,一切正常。问题只发生在生产现场。
custom.css 和 custom.js 都没有最小化。可以看到自定义csshere and custom.js here.
渲染时,所有 CSS 都加载了这个 URL:http://demo.relojelectronico.cl/Content/css?v=l7FFCONJaEcRHBZMIAQIwzM3XkNczNlgWBYwjHtrumM1
并且所有 JS 都呈现为:http://demo.relojelectronico.cl/bundles/gentelella?v=vBQcZjDbD_j0oRIktzJoqND9pbeEqe-jNtQFHZ9YfMM1
任何帮助将不胜感激。
编辑:
我注意到 CSS 文件已正确呈现。问题只是 custom.js.
为了测试它,我将它分开捆绑,这样:
bundles.Add(new ScriptBundle("~/bundles/custom").Include(
"~/Scripts/custom.js"
));
这样,您就可以看到捆绑版本here。
奇怪的是,原始 JS 以以下内容开头:
/**
* Resize function without multiple trigger
*
* Usage:
* $(window).smartresize(function(){
* // code here
* });
*/
(function ($, sr) {
// debouncing function from John Hann
// http://unscriptable.com/index.php/2009/03/20/debouncing-javascript-methods/
var debounce = function (func, threshold, execAsap) {
var timeout;
return function debounced() {
var obj = this, args = arguments;
function delayed() {
if (!execAsap)
func.apply(obj, args);
timeout = null;
}
if (timeout)
clearTimeout(timeout);
else if (execAsap)
func.apply(obj, args);
timeout = setTimeout(delayed, threshold || 100);
};
};
// smartresize
jQuery.fn[sr] = function (fn) { return fn ? this.bind('resize', debounce(fn)) : this.trigger(sr); };
})(jQuery, 'smartresize');
/**
* To change this license header, choose License Headers in Project Properties.
* To change this template file, choose Tools | Templates
* and open the template in the editor.
*/
var CURRENT_URL = window.location.href.split('#')[0].split('?')[0],
$BODY = $('body'),
$MENU_TOGGLE = $('#menu_toggle'),
$SIDEBAR_MENU = $('#sidebar-menu'),
$SIDEBAR_FOOTER = $('.sidebar-footer'),
$LEFT_COL = $('.left_col'),
$RIGHT_COL = $('.right_col'),
$NAV_MENU = $('.nav_menu'),
$FOOTER = $('footer');
// Sidebar
function init_sidebar() {
// TODO: This is some kind of easy fix, maybe we can improve this
var setContentHeight = function () {
// reset height
$RIGHT_COL.css('min-height', $(window).height());
var bodyHeight = $BODY.outerHeight(),
footerHeight = $BODY.hasClass('footer_fixed') ? -10 : $FOOTER.height(),
leftColHeight = $LEFT_COL.eq(1).height() + $SIDEBAR_FOOTER.height(),
contentHeight = bodyHeight < leftColHeight ? leftColHeight : bodyHeight;
// normalize content
contentHeight -= $NAV_MENU.height() + footerHeight;
$RIGHT_COL.css('min-height', contentHeight);
$RIGHT_COL.css('height', contentHeight);
};
(我刚刚放置了它的开头)。正如您所注意到的,当创建捆绑包时,它从 init_sidebar 函数开始。 JS 文件中的许多函数也会发生同样的情况。它们在捆绑后从文件中删除。
这怎么可能?
我测试过 BundleTable.EnableOptimizations = false;在 BundleConfig 中,这样 custom.js 按原样呈现。仅在优化时出现此问题。
尝试添加
<add name="BundleModule" type="System.Web.Optimization.BundleModule" />
在网络配置中 <modules> under <system.webServer>.
有用link:Why is my CSS bundling not working with a bin deployed MVC4 app?
我回答我的问题是否能帮助其他人解决这个问题。
这没有记录,但我发现了问题所在。
事实证明,在两个文件夹(内容和脚本)中存在 custom.css 和 custom.js 的缩小版本(名称分别为 custom.min.css 和 custom.min.js ).那些缩小版本不是custom.css和custom.js对应的缩小版本,而是原始版本。
所以,我使用了一个在线压缩器 (for CSS and for JS) 并替换了该网站的最小版本,并且成功了。
这是结论。当在 ASP.NET MVC 中启用优化时,优化器首先查找等效的“.min”。如果文件存在于文件夹中。如果是,则将该文件发送到浏览器。如果没有,它会执行缩小。
这可能也是“.min.”的原因。文件的版本被添加到捆绑中,它不起作用,文件根本没有发送。
也许所有这些都记录在某处,但我没有找到。
干杯,
海梅