I have a project that is using ASP.NET Bundling. I am having an issue where the .map files are throwing an error on the client side even though I have explicitly excluded them from the bundling using the ignore list.
bundles.Add(new ScriptBundle("~/bundles/stuff").IncludeDirectory(
"~/Scripts/stuff/", "*.js", true));
bundles.IgnoreList.Ignore("*.map");
When I run the project I get a 500 error with the following message:
The view 'The controller for path '/stuff/Charting.js.map' was not
found or does not implement IController.' or its master was not found
or no view engine supports the searched locations.
How do I get this to properly ignore the .map files in the directory while bundling?
If I understand you correctly you shouldn't be having any real issues.
.map files allow a browser to download a full version of the minified JS. It is really for debugging purposes.
The .map missing shouldn't a problem. You only know it is missing, as the browser has had its Developer tools opened and is just informing you that the JS debugging won't be as good as it could be.
This is why libraries like jQuery have the full, the minified and the map file too.
See this article for a full explanation of .map files.
Alternatively, you could actually include the .map files in your project.
Related
I've created a basic angular project using yeoman's angular generator. While the standard Grunt process is fine in general, I do have my concerns with the way how the views get all minified into the same JS File.
If I have about 10 views on my Page, the requested view can't be seen until 'all' pages have been loaded, since their all in the same file.
I now want to modify the Grunt process, so that each HTMLviewfile get minified into its own file in a views directory. The main angular router should now request the view files as they are requested by the client (user).
Is there any way you could help me. All my research has resulted that the module 'grunt-angular-templates' is responsible for minification of all HTML views. I've yet to find out, how to keep the files from getting merged into a single file.
Thanks!
I found out, that in order to not minify all the view files into the script.js file, you have to remove the ngtemplate process from you gunt build task
I have minified CSS and JS files that are auto-generated by Web Essentials, and auto-updated every time I update and save the original files.
What would be the best way to automatically toggle the actual (script/import) references within HTML between original (in Dev/Test) and minified (in Production) files?
This is within an MVC ASP.NET web app.
One idea would be to have server-side tags that render either ".min" or empty string based on an environment variable. But I'm wondering if there's a better, smarter, easier, more efficient way of handling this.
Thanks in advance.
Update:
My style bundle is defined like this:
bundles.Add(new StyleBundle("~/Content/css").Include("~/Content/site{version}.css"));
And I reference it like this:
#Styles.Render("~/Content/css")
However, this renders the following:
<link href="/Content/css?v=" rel="stylesheet"/>
It works fine if I take "{version}" out of bundle definition, but renders an empty "v=" if I include "{version}".
Update 2:
I just realized that due to certain complexities of the application, I can't use the bundling solution. What other options do I have?
Bundling will help you in this instance. You should already be able to see an example in your BundleConfig.cs file in App_Start.
Here is a tutorial on how to conifgure it http://www.asp.net/mvc/tutorials/mvc-4/bundling-and-minification
From that tutorial, this is how you actually configure the bundles themselves, the files that will be in them, etc. This includes any jquery in the scripts folder into a bundle called ~/bundles/jquery.
public static void RegisterBundles(BundleCollection bundles)
{
bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
"~/Scripts/jquery-{version}.js"));
// Code removed for clarity.
BundleTable.EnableOptimizations = true; // <-- this line overrides the debug check to show you the minified version even in debug mode... remove it for normal .min in debug/un-minned when not in debug behaviour
}
You then reference these from your views using
#Scripts.Render("~/bundles/jquery")
This will then render a script tag with the .min version of the jquery if you're not in debug or leave it out if you are. There needs to be a .min version and an un-minified version in the same scripts folder (which you should have if Web Essentials is creating the .min for you.
You could actually stop using Web Essentials to do the minification if you use ScriptBundles as they will minify the javascript for you when it packages it into the bundle.
For your update
The "~/Scripts/jquery-{version}.js" means match any file in the scripts folder that starts with jquery- and ends with .js and has some version number between. If the files don't have a version number in them, then don't try and use the {version} substitution.
They do it with jquery in this case so that if you upgrade the version of jquery that you are using, you don't have to go back into your BundleConfig and manually change the file name for your jquery reference.
If your file was named site1.3.7.css, then this would probably work.
bundles.Add(new StyleBundle("~/Content/css")
.Include("~/Content/site{version}.css"));
but it sounds more likely that you just need site.css.
bundles.Add(new StyleBundle("~/Content/css")
.Include("~/Content/site.css"));
I'm not sure what you think prevents you from using them but you can link to files in CDNs and minify or not minify. Even just have individual files in a bundle to get the benefit of minification outside of debug without "bundling" them. So there's probably a way.
I have build MVC 5 application which works fine when running via VS. When I publish it to the server first time it also works. Now I have made few correction to my css file and publish whole project again but website still see the old css file. I have removed all files from the server and tried few more times but it is still the same. When I check the css file on the server, the changes are inside the file.
I think it is related to MVC bundling as when I check the source it says that is accessing different file which is not even located on the server:
<link href="/Content/cssmain?v=Ikj7NnMg3q9kTHR7ynWOJDQFGMZl3mtVMi_2EkOJxc41" rel="stylesheet"/>
How can I force VS to minificate my css file again?
I've tried cleaning, rebuilding but no luck
Edit:
My bundle set up look like below and all files are located on the server in Content folder.
bundles.Add(new StyleBundle("~/Content/cssmain").Include(
"~/Content/bootstrap.css",
"~/Content/site.css",
"~/Content/ilightbox.css",
"~/Content/bannerscollection_zoominout.css"));
Many thanks
I think it is related to MVC bundling as when I check the source it says that is accessing different file which is not even located on the server:
CDN location? External Css lib (yours or 3rd party)? unsure what you meant by "not located on server"?
Yup, it does (look like ASP.net Bundling in action) - check your Global.asax, App_Start/BundleConfig or _AppStart and see if the bundle configuration setup point to/reference the "correct" locations for your css (and or script).
Is it just you experiencing getting the old css file loaded? Or anyone who views the site?
I am currently working with web optimization bundler that is part of the .net framework that bundles up both my javascript and css in to a single file. This works nicely.
I have run in to a problem with it though. See the following code:
BundleTable.Bundles.Add(new ScriptBundle("mybundle").Include(
"~/Scripts/globalize.js",
"~/Scripts/jquery.validate.js",
string.Format("~/resources.axd")));
This bundles up all the javascript from the files but also I would like to bundle the output from my .axd http handler. This returns javascript. However the javascript never gets included in the bundle. If I run the handler in my browser, no issue, javascript is returned.
I am wondering maybe the bundler does not recognize the .axd extension and therefore does not attempt to request the file. Any ideas if this is the case and the work around?
Correct, you can only include files into bundles, it will not make requests to the axd for you. What you can do is manually hit the axd, and save the file to disk and include that into your bundle.
I just wrote a script bundle for resx - you can find the source here
https://github.com/MrAntix/sandbox-resx-script-bundling
In BundleConfig, add your bundle ...
bundles.Add(
new ResxScriptBundle("~/bundles/local")
.Include<JsResources>("app")
);
It creates a model for each resource like this ...
window.resources=window.resources||{};
window.resources.app = {
"HelloWorld": "Hello World, from JSResources.resx"
};
And you can use it in your JS like this ...
$("h1").append(window.resources.app.HelloWorld);
... for example
I started getting errors after I turned on Drupal's performance improvements which pack all the CSS and JS files into single files. The error looks like this:
The selected file /tmp/fileO4fjBF
could not be uploaded, because the
destination
js/js_8a69e612be02242c2866a4a19223bd12.js
is not properly configured.
I'm not sure how I should configure my server for this to work correctly. There is nothing in the documentation about this.
Check you ' Site Configuration > Files' settings or the report. If it is a file permission issue (or maybe a missing folder) it should be apparent from one of those two places.
Often the report or files-settings also supply information on how to remedy the problem.