This is very curious. I have these bundles in 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"));
See that I have CSS bundles and script bundles. See specially the last one in both bundles, custom.css and custom.js.
The curious thing is that from all files, only custom.css and custom.js are not rendered when publishing the site. When I debug, all works correctly. The problem happens only at the production site.
Both custom.css and custom.js are not minimized. You can see custom css here and custom.js here.
When rendered, All CSS are loaded with this URL: http://demo.relojelectronico.cl/Content/css?v=l7FFCONJaEcRHBZMIAQIwzM3XkNczNlgWBYwjHtrumM1
And all JS are rendered with: http://demo.relojelectronico.cl/bundles/gentelella?v=vBQcZjDbD_j0oRIktzJoqND9pbeEqe-jNtQFHZ9YfMM1
Any help will be appreciated.
EDIT:
I have noticed that the CSS file is correctly rendered. The problem is only custom.js.
To test it, I have bundled it separated, this way:
bundles.Add(new ScriptBundle("~/bundles/custom").Include(
"~/Scripts/custom.js"
));
That way, you can see the bundled version here.
the curious thing, is that the original JS starts with the following:
/**
* 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);
};
(I have just placed the start of it). As you can note, when the bundled is created, it starts from init_sidebar function. the same happens with a lot of functions inside the JS file. They are removed from the file after bundling.
How can this be possible?
I have tested with BundleTable.EnableOptimizations = false; in BundleConfig and that way, custom.js is rendered as it is. The problem only occurs when optimizing.