Link to home
Start Free TrialLog in
Avatar of flynny
flynnyFlag for United Kingdom of Great Britain and Northern Ireland

asked on

Bundling Doesn't Seem to be grabbing .min version of files?

Hi All,

I have a site where I have the follwing script and css bundes;

        public static void RegisterBundles(BundleCollection bundles)
        {
            bundles.Add(new ScriptBundle("~/bundles/jquery").Include(
                        "~/scripts/jquery-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include(
                        "~/scripts/jquery-ui-{version}.js"));

            bundles.Add(new ScriptBundle("~/bundles/bootstrap").Include(
                        "~/scripts/bootstrap.js",
                        "~/scripts/bootstrap-datepicker.js"));

            bundles.Add(new ScriptBundle("~/bundles/knockout").Include(
                        "~/scripts/knockout-2.2.0.js"));

            bundles.Add(new ScriptBundle("~/bundles/theme").Include(
                        "~/scripts/placeholders.js",
                        "~/scripts/respond.js",
                        "~/scripts/html5shiv.js",
                        "~/scripts/main.js"));

            bundles.Add(new ScriptBundle("~/bundles/themepunch").Include(
                        "~/scripts/jquery.themepunch.tools.js",
                        "~/scripts/jquery.themepunch.revolution.js"));

            bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include(
                        "~/scripts/jquery.unobtrusive*",
                        "~/scripts/jquery.validate*"));

            // Use the development version of Modernizr to develop with and learn from. Then, when you're
            // ready for production, use the build tool at http://modernizr.com to pick only the tests you need.
            bundles.Add(new ScriptBundle("~/bundles/modernizr").Include(
                        "~/scripts/modernizr-*"));

            
            bundles.Add(new StyleBundle("~/content/css").Include(
                        "~/content/css/bootstrap.css",
                        "~/content/css/datepicker.css",
                        "~/content/css/custom.css",
                        "~/content/css/font-awesome.css",
                        "~/content/css/settings.css"));

            bundles.Add(new StyleBundle("~/content/css/theme").Include(
                        "~/content/css/styles/style.css",
                        "~/content/css/styles/skin-lblue.css"));

            BundleTable.EnableOptimizations = true; 
        }

Open in new window


I have copies of both .css and .min.css and .js an .min.js in the ~/content/css/ folder, etc.

However when I load my site and look at network tools in firefox for example ad pagespeed insights on google. It doesnt seem be loading the .min versions of the files?

is there anything is can do to ensure the minified files are used?
Avatar of Lokesh B R
Lokesh B R
Flag of India image

Hi,

Check the 2nd Point.

The {version} wild card matching shown above is used to automatically create a jQuery bundle with the appropriate  version of jQuery in your Scripts folder.  In this example, using a wild card provides the following benefits:

1. Allows you to use NuGet to update to a newer jQuery version without changing the preceding bundling code or jQuery references in your view pages.

2. Automatically selects the full version for debug configurations and the ".min" version for release builds.

http://www.asp.net/mvc/overview/performance/bundling-and-minification
Avatar of flynny

ASKER

Hi Lokesh,

But it doesn't seem to include any of the .min.js files.

As far I as knew the bundle would select the .min.js files, if available and fall back to the standard .js if these were not present.

So do I need to add the wild card to make it include the .min.js and .min.css??
Hi,

Since you are in the DEBUG Mode it will select the .js files instead .min.js because of debugging.

If you want to check whether it is taking the .min.js files, please host the applicaiton in your local IIS and browse from there.

You can see the .min.js files in network tab of browser.

same as been explained in asp.net website.

Automatically selects the full version for debug configurations and the ".min" version for release builds.


http://www.asp.net/mvc/overview/performance/bundling-and-minification
Avatar of flynny

ASKER

Hi Lokesh,

Ok, I've deployed the site to a folder and then uploaded the deployed site.

Now the issue i shave is it doesnt seem to be referencing the css?

(images and js are loading fine).

E.g. I have the published files as below;

<link rel="stylesheet" href="/content/css?v=8i2nabSTk8FyKAwSI4qmdCThCwrjCtj9ofhrH7P93Pg1"></link>
<link rel="stylesheet" href="/content/css/theme?v=EZa3FBUzT6T84m4HP46IJ0nci0aD6fT3PL0a6dnPRO41"></link>
<script async="" src="//www.google-analytics.com/analytics.js"></script>
<script src="/bundles/modernizr?v=PA5XxNfArGq5CRubLb9XK0eImC8J_QIyNswrowrmOpg1"></script>

Open in new window


the css files are inside the content/css folders and i have checked have uploaded ok. Is there aomething i need to check on iis? I'm running iis 7 by the way.
Hi,

I can see the css files here

<link rel="stylesheet" href="/content/css?v=8i2nabSTk8FyKAwSI4qmdCThCwrjCtj9ofhrH7P93Pg1"></link>
<link rel="stylesheet" href="/content/css/theme?v=EZa3FBUzT6T84m4HP46IJ0nci0aD6fT3PL0a6dnPRO41"></link>
Avatar of flynny

ASKER

Lokesh,

I assume the hash is the bundling which references the .dll created on the publish.

However, its not picking up the .css in the split down stylesheets? i.e. /content/css/custom.css for instance?

i.e. if i inspect my logo which has a class of 'circle-logo' which is held in the custom.css file its not seeing it. Is htere any way of debugging this?
Hi,

Nope..!!!!

The request /content/css?v=8i2nabSTk8FyKAwSI4qmdCThCwrjCtj9ofhrH7P93Pg1
is for the bundle AllMyScripts and contains a query string pair v=8i2nabSTk8FyKAwSI4qmdCThCwrjCtj9ofhrH7P93Pg1.

The query string v has a value token that is a unique identifier used for caching. As long as the bundle doesn't change, the ASP.NET application will request the AllMyScripts  bundle using this token.

If any file in the bundle changes, the ASP.NET optimization framework will generate a new token, guaranteeing that browser requests for the bundle will get the latest bundle.
Avatar of flynny

ASKER

Hi,

Ok, so why would it not load these css files then? no edits have been made to anything, its just been deployed directly to a folder

I then uploaded all files in the folder to the site?
any ideas?
Hi,

Is it possible to share the URL of your application?
Avatar of flynny

ASKER

yeah no problem.

the working url is

www.bridge-direct.co.uk - this is the working site
dev.mfitonline.co.uk - this is the deployed version of the site
Hi,

As you can see in the screenshot there are permission issues in loading the CSS folder for the IIS USER accessing the files.

Provide the necessary permissions on the folder and check.

User generated image
Avatar of flynny

ASKER

Hi,

Sorry for the delay. I'm not sure whats going on here.

After checking the permissons on the folder IIS_USER has all access on the css folder.

Am I missing something? I'm running IIS 7.5
iis-pic1.png
Hi,

Check whether ASP.NET is registered or not.

try adding this in your web.config file.

<system.webServer>
 <modules runAllManagedModulesForAllRequests="true"/>
</system.webServer>
Avatar of flynny

ASKER

Hi Lokesh,

Thanks for all your help.

I currently already have this in my web.config (in the root of my project)

  <system.webServer>
    <validation validateIntegratedModeConfiguration="false" />
    <modules runAllManagedModulesForAllRequests="true" />
  <handlers>
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" />
      <remove name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" />
      <remove name="ExtensionlessUrlHandler-Integrated-4.0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_32bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness32" responseBufferLimit="0" />
      <add name="ExtensionlessUrlHandler-ISAPI-4.0_64bit" path="*." verb="GET,HEAD,POST,DEBUG,PUT,DELETE,PATCH,OPTIONS" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v4.0.30319\aspnet_isapi.dll" preCondition="classicMode,runtimeVersionv4.0,bitness64" responseBufferLimit="0" />
    <add name="ExtensionlessUrlHandler-Integrated-4.0" path="*." verb="*" type="System.Web.Handlers.TransferRequestHandler" resourceType="Unspecified" requireAccess="Script" preCondition="integratedMode,runtimeVersionv4.0" />
    </handlers>
    <httpProtocol>
      <customHeaders>
        <remove name="Vary"></remove>
        <add name="Vary" value="Accept-Encoding"></add>
      </customHeaders>
    </httpProtocol>
    <httpCompression directory="%SystemDrive%\inetpub\temp\IIS Temporary Compressed Files">
      <scheme name="gzip" dll="%Windir%\system32\inetsrv\gzip.dll"/>
      <dynamicTypes>
        <add mimeType="text/*" enabled="true"/>
        <add mimeType="message/*" enabled="true"/>
        <add mimeType="application/javascript" enabled="true"/>
        <add mimeType="*/*" enabled="false"/>
      </dynamicTypes>
      <staticTypes>
        <add mimeType="text/*" enabled="true"/>
        <add mimeType="message/*" enabled="true"/>
        <add mimeType="application/javascript" enabled="true"/>
        <add mimeType="*/*" enabled="false"/>
      </staticTypes>
    </httpCompression>
    <urlCompression doStaticCompression="true" doDynamicCompression="true"/>
  </system.webServer>

Open in new window


anything else I can check?
Avatar of flynny

ASKER

Lokesh,

Thanks for pointing me in the right direction. The issue seemed to be due tot he fact that the virtual path set in the bundling was matched that of hte physical path in the site.

simply appending bundle to the virtual directory fixed the issue.

I found the solution here;

http://forums.asp.net/t/1810635.aspx?403+Access+denied+when+using+Bundling

as you can see this has fixed the issue.
ASKER CERTIFIED SOLUTION
Avatar of Lokesh B R
Lokesh B R
Flag of India image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of flynny

ASKER

Lokesh,

Thanks for you patience an all your help.