mvc-using bundles to introduce CSS and JS files

Advantage: The hash version number is automatically generated when you modify JS or CSS.

Disadvantage: You need to add the corresponding file in the Bundleconfig, then refer to the corresponding bundle in the HTML, one more step.

<compilation debug= "true" targetframework= "4.5"/> in Web. config

1, Bundleconfig

If it is debug mode, the front page will display the real JS, CSS path, the production environment will show the previous path. Wildcard references can also be used in bundles.

Bundles. ADD (new scriptbundle ("~/bundles/jquery"). Include (                        "~/scripts/jquery-{version}.js"));            Bundles. ADD (new scriptbundle ("~/bundles/jqueryval"). Include (                        "~/scripts/jquery.validate*"));

Bundles. ADD (NewScriptbundle ("~/bundles/bootstrap"). Include ("~/scripts/bootstrap.js",                      "~/scripts/respond.js")); Bundles. ADD (NewStylebundle ("~/content/css"). Include ("~/content/bootstrap.css",                      "~/content/site.css"));

2. Front Page

@Styles. Render ("~/content/css")    @Scripts. Render(" ~/bundles/modernizr ")

3, the global file

To register bundles in the Application_Start event.

Bundleconfig.registerbundles (Bundletable.bundles);

4. Description

The version hash value is generated only if the JS, CSS file is modified in the production environment.

In a production environment, the compressed version of min files is automatically referenced in the way that bundles is used.

5. Description

Debug mode

Production environment

mvc-using bundles to introduce CSS and JS files