Bundling: Difference between rendering of script with optimizations on and off - asp.net

I'm using ASP.NET 4.5 MVC4 and I've setup a bundling of css and javascript files with custom made bundles that worked before.
I've made the bundles myself, because the load order is important.
Somehow it stopped working. I did an update to the latest WebGrease (1.3.0) recently. Could that be a problem?
The strange thing is it works when I set BundleTable.EnableOptimizations to false. But when I set it to true, I get js errors.

Which js errors do you get? The main difference with the property EnableOptimization to on (see this page) is that it concatenates all your scripts and minifies them.

Related

ASP.Net cannot render the page when compilation debug is false

I have an ASP.Net project framework 4.5.2. When I set the compilation debug="true" in web.config, the page is working fine. When I set the debug="false", the page cannot be rendered. It shows special character as below:
Please give me the solution to fix the issue.
My best guess?
When you set debug= false?
That forces the project to use the min (minimized) version of your JavaScript libraries.
For example I modified some of the JavaScript routines in the ajaxtoolkit library. Debug=false never worked or saw my JavaScript changes.
So I installed a JS minimizer package. Now when I modify the JavaScript. I at that point in time also run the minimizer against that js routine and thus when you use debug=false, then your project will now be using the js.min versions of your JavaScript libraries.
Minimization is a huge topic - way way beyond a simple post and answer on SO.
However flipping debug= false does mean your now using the min version of those JavaScript libraries - and thus they must exist - so I would look and check what JavaScript libraries that page uses. You can compile the application as release, but setting debug=false also means JavaScript.min libraries will be used.
So check above in regards to what JavaScript libraries that page uses (and ensure the min versions of those libraries exist before you attempt a publish)
Edit --
Also,try clearing the browser cache - all of it.
For my case, the problem was caused by WebMarkupMin package. The page implements WebMarkupMin's MinifiedAndCompressedHtmlPage class.

Why does ASP.net give errors when trying to minify CSS files for common frameworks such as Bootstrap?

I'm working on an ASP.net web app. I needed to make some changes to the CSS, but I ended up having to jump thru some hoops because the previous developer who worked on the app had minified all the CSS files in the source repo.
I decided to make things easier for myself in the future by setting up ASP.net bundling and minification. It turns out that for some reason, ASP.net throws errors when trying to minify CSS for Bootstrap 3.3.5, Kendo UI v2017.2.504 (specifically kendo.common-material.css), and Material Dashboard Pro v1.1.0. I get the error Minification Failed. Returning unminified contents.
I tried minifying these files with cssminifier.com and they appear to work fine, so I'm at a loss to explain why I get an error when minifying with ASP.net.

Bootstrap update only working on Debug configuration (Visual Studio)

So I recently update from bootstrap 2 to bootstrap 4. I then changed the syntax, grids and such. The website was running/building fine in debug, however, when it comes to release, it won't work. It can build without errors, but when I run it, it seems like the site has the new syntax and classes (the code running is the one i changed) but bootstrap is still at v.2. I checked multiple times, there are no bootstrap 2 files left, nor any cdn references. I can see it still is running bootstrap 2 by changing classes from col-12 to, say span12. It works fine in debug, but not in release. Any clue why ?
Also, the site is running Asp.NET Core MVC Razor.
I think you might have a bundle-ing configuration issue.
Please verify your bundle configuration (App_Start\BundleConfig.cs) and the web.config settings and pertinent web.config transform.
You can find documentation on how to configure your bundles here : Bundling and Minification (assuming you're not using ASP.NET Core)
For ASP.NET Core it a bit more complicated because you can have multiple ways of doing the budleing. Documentation for it can be found here: Bundle and minifiy static assets in ASP.NET Core.
However, I think that is pretty probable that the production version of your app is still targeting the old Bootstrap version because of the bundle-ing configuration

asp.net MVC Bootstrap, replacing the .min.css file

This should work and I have no clue why it doesn't, literally all I am doing is creating a new ASP.NET MVC Web application in VS15 Community, and then I replace the existing min.css file with another one (from bootswatch). And it doesn't change anything.
I have practiced mvc for a bit and every time I tried to change my layout later on in the project, it worked every time, but now as I just decided to get it out of the way straight up it just doesn't do anything.
You'll want to change the non-minified version as well.
Edit: Because the minified version is used when you publish and the non-minified version is used during debug, generally.

ASP.NET Bundling and Minification - Including Already Minified Files for Production Bundles and Unminified Files for Development

I want some expert advice on ASP.NET MVC Bundling and Minification. I have in my project script files that have both unminified (.js) and minified versions (.min.js). I have included them in my script bundle as follows:
bundles.Add(new ScriptBundle("~/bundles/layout").Include(
"~/Scripts/jquery-{version}.js",
"~/Scripts/lib/errorhandling.js",
"~/Scripts/lib/errorhandling.min.js",
"~/Scripts/vendor/modernizr.custom.js",
"~/Scripts/vendor/modernizr.custom.min.js",
"~/Scripts/toastr.js",
"~/Scripts/toastr.min.js"));
It seems that the bundle indeed contains only once each script file, not twice. I have confirmed this both for development and production. (As a side note, in development, that is, when debug=true, the bundles are not rendered but the files are included as separate script tags. This is the desired behaviour for me, as well.)
My questions are:
(1) Is this the best and recommended way to include already minified files for production setup and unminified files for development?
(2) Does ASP.NET try to minify the whole bundle in production (even though it is already minified)? If yes, what is the best way to prevent ASP.NET from trying to minify the bundle?
Thanks in advance!
There is no need to specifically include the minified versions in your script bundle. By default, MVC will search for a matching file with .min.js and include that (not entirely sure if it trys to minify further). If not, it creates a minified version. You can test this by adding the following to BundleConfig.cs
using System.Web.Optimization;
then adding the following at the end to override debug=true in development
BundleTable.EnableOptimizations = true;
From MS documentation
The bundling framework follows several common conventions such as:
Selecting “.min” file for release when “FileX.min.js” and “FileX.js”
exist.
Selecting the non “.min” version for debug.
Ignoring “-vsdoc” files (such as jquery-1.7.1-vsdoc.js), which are used only by
IntelliSense.
Minification, or not, the bundling feature is useful to for logical groupings of scripts and css that go together, and as a single place to control things. It also generates unique URLs, so eliminates browser cache problems.
If you use ScriptBundle, the engine will try to minify, (except when you set debug=true as you've shown).
You can turn off minification, but retain bundling, by just using Bundle() instead of ScriptBundle(). See Martin's answer here:
ASP.NET Bundles how to disable minification
As an aside, using pre-minified files with Bundle() as opposed to ScriptBundle(), will preserve the license headers. With jquery's MIT license, it at least stipulates that it should not be removed. I'm not sure how to interpret the fact that the default Microsoft MVC template uses ScriptBundle().

Resources