MVC4 Bundling Wildcards - * vs. {version} - asp.net-mvc

I understand and fully appreciate the new bundle wildcard {version} regex, as it will continue to pick up your script and style libraries even after updating, etc. The problem is that I cannot get it to work effectively.
I had previously use the following notation to pick up my jQuery scripts:
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-1.*"));
and it would pick up all files matching the asterisk wildcard.
But when I tried the following:
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
I noticed that the jQuery file was not written out to the _Layout.cshtml page.
NOTE - I am indeed using the following HTML code for both examples:
#Scripts.Render("~/bundles/jquery")
When I use the first example above (" * ") notation the following is written to the page:
<script src="/Scripts/jquery-1.7.2.js" type="text/javascript"></script>
However when I use the "{version}" notation, there is merely an empty space where the library should be written. This pertains to both jquery files as well as the associated CSS stylesheets.
It does not matter whether I am compiling for DEBUG or RELEASE mode. The results are the same. Obviously in release mode I'll get the optimized version when using the "*" notation:
<script src="/bundles/jquery?v=VUv2YOeuOgHad-FHZ-vGMDu9wN1j9VZGifI1SBUUSMs1" type="text/javascript"></script>
So being the perfectionist that all developers are, I would greatly like to see the {version} notation work for me, as I do keep up to date on new releases and would like this control on my deployments.
Any insight into what I may be doing wrong is greatly appreciated.
Thanks in advance,
Dan

Try updating Microsoft.AspNet.Web.Optimization and related NuGet packages: Microsoft.Web.Infrastructure, WebGrease, Antlr. Check not just "nuget.org" tab, but also "All".

Related

default bootstrap in asp.net mvc project, how does it work?

I am playing with ASP.NET MVC default project.
I can see that it uses bootstrap. However, when I run the project I don't see something like:
<link href="/Content/bootstrap.css" rel="stylesheet"/>
as I would expect.
Instead I see something like:
<link href="/Content/css?v=LzveySGbzre5hK6VV4ZexwQl1hUNcljL4UffuTMZH8g1" rel="stylesheet"/>
which is actually the minimized bootstrap.
why is that???
Also, I'm inspecting the input field in the default forms (register, login) and I can see that there is the css rule:
input, select, textarea {max-width: 280px;}
However, when I perform searches on all my solution I can not find anywhere which contain such rule: max-width: 280px (I can't even find the string "280px")
What is going on? where did this 280px appears from?
You need to check APP_Start\BundleConfig and code .css and site.css for manking bootstrap working... if you are using VS2013, you can choose MVC project that already includes bootstrap libraries...
Regards!!!

Grails 2.4.4 SCSS support?

I added sass-grails-asset-pipeline, and in main.gsp I have this:
<asset:stylesheet src="application.css"/>
If I change stylesheets/application.css to stylesheets/application.scss, the GSP produced creates no <link> to request the css. If I do a manual request for http://localhost:8080/my-app/assets/application.css I get a 404.
What's going on? Is there some special undocumented setup to get SCSS working properly?
Make sure you're using a sass-assets plugin that exactly matches your assets-plugin. Mismatching will cause issues.

Script bundles not rendering individual files in debug

I have two script bundles defined:
bundles.Add(new ScriptBundle("~/scripts/common").Include(
"~/Scripts/jquery-1.11.1.js",
"~/Scripts/jquery-ui-1.10.4.custom.min.js",
"~/Scripts/jquery.validate.js"));
bundles.Add(new ScriptBundle("~/scripts/sectionCommon").Include(
"~/Scripts/A.js",
"~/Scripts/B.js",
"~/Scripts/C.js"));
I have one set on my master layout page:
#Scripts.Render("~/scripts/common")
And one set on a subset of my pages where it is used:
#Scripts.Render("Scripts/sectionCommon")
So far so good and this works.
When I run my site using debug compilation, the JS files from the first bundle are rendered to the markup as individual script links per file, whereas the second bundle remains as a single minified bundle:
<script src="/siteRoot/Scripts/jquery-1.11.1.js"></script>
<script src="/siteRoot/Scripts/jquery-ui-1.10.4.custom.min.js"></script>
<script src="/siteRoot/Scripts/jquery.validate.js"></script>
<script src="/siteRoot/Scripts/sectionCommon"></script>
Does anybody have any idea why this might be happening? Bit of a pain while debugging.
Figured this out while I was writing the question. Thought I would answer it in case this bites anybody else. The difference between the two was using the tilda to get a site relative url:
#Scripts.Render("~/scripts/common")
#Scripts.Render("Scripts/sectionCommon")
Both of these render out the script as intended, but only the top one (using the site relative URL) was rendering out the individual script references in debug.

Why doesnt the MVC4 bundling bundle Knockout.js?

I have downloaded MVC4 and trying to work out how the bundling feature works in a standard project. It would seem that having the bundle:
<script src="#System.Web.Optimization.BundleTable.Bundles.ResolveBundleUrl("~/Scripts/js")"></script>
Brings back all the jquery.js files but not the knockout.js files in the included scripts. Why is this? And also what is the _references.js file about and why is the knockout.js file commented out?
If you look into your project Global.asax file, you should find there something like this:
protected void Application_Start()
{
...
BundleTable.Bundles.RegisterTemplateBundles();
}
Now the RegisterTemplateBundles is registering only a predefined subset of scripts:
jquery-*
jquery.mobile*
jquery-ui*
jquery.unobtrusive*
jquery.validate*
MicrosoftAjax.js
MicrosoftMvc.js
modernizr*
AjaxLogin.js
If you want some additional files you could either change RegisterTemplateBundles to EnableDefaultBundles:
protected void Application_Start()
{
...
BundleTable.Bundles.EnableDefaultBundles();
}
Or create your own custom bundle (you can read more about bundling and minification here). You should also know that EnableDefaultBundles has some performance impact.
The _references.js file is used by Visual Studio for JavaScript intellisense. You can learn more from following article:
JavaScript Intellisense in VS11, The _references.js File
tpeczek is correct. Most folks don't use Knockout.js, that's why it's not included by default. Bundling/Minification (BM) has changed considerably for RC and it will be much simpler to add files to bundles. See my Bundling and Minification tutorial
I was able to add a file to the bundle with the following line of code added after the RegisterTemplateBundles()
BundleTable.Bundles.RegisterTemplateBundles();
BundleTable.Bundles.Where(x => x.Path == "~/Scripts/js").First().AddFile("~/scripts/knockout-2.0.0.js");

jQuery and url re-write

I am having a wierd error and jQuery not working depending on how the url is written.
if the url is
/index.cfm?show=about-us
all is good. BUT if the url is
/index.cfm/show_about-us
jQuery doesn't seem to load correctly and I get a "$ is not defined" error in fireBug
I can't use the standard ?= query string I need to be able to use the re-write method.
Any ideas are appriciated
Lance
What does your <script src="..."> say? I have a feeling it's looking for /index.cfm/jquery.js which doesn't exist.
Sorry this was a reference issue to the files. Evendently in that re-write sytle the dom is still trying to navigate the file system starting in the /show_about-us/ directory which isn't truely a directory.
That's it. #recursive got it in one.
Consider using the absolute path from the root of your domain in src attributes. For example: <script src="/jquery.js">

Resources