HTML and CSS Reference
In-Depth Information
3. Add the following code to the
Application_Start()
method to create two custom
bundles:
BundleTable.Bundles.Add(new ScriptBundle("~/Scripts/myJs").Include(
"~/Scripts/controlWorker.js",
"~/Scripts/controlSharedWorker.js"));
BundleTable.Bundles.Add(new StyleBundle("~/Content/myCss").Include(
"~/Content/Sample.css"));
This code first creates a
Bundle
object, specifying the logical name that it will be referenced by. It then uses
the
Include()
method to list the appropriate files that should be included in the bundle. Finally, the new bundle
is added to the
BundleTable
object so it will be available to the web page.
4.
Change the script reference in the
Index.cshtml
file to use the
myJs
and
myCss
bundles using the
Scripts.Render()
and
Styles.Render()
helper functions. Also,
comment out the existing script and css references. Your file references should look
like this:
<head>
<meta charset="utf-8" />
<title>Chapter
5
- Web Workers</title>
@Scripts.Render("~/Scripts/myJs")
@Styles.Render("~/Content/myCss")
<!--
<link rel="stylesheet" type="text/css" href="Content/Sample.css" />
<script src="Scripts/controlWorker.js"></script>
<script src="Scripts/controlSharedWorker.js"></script>
-->
</head>
■
Note
The
Scripts.Render()
and
Styles.Render()
helper functions will generate the appropriate referenc-
es to access the specified bundles. However, in debug mode when bundles are disabled, it will generate references
to the individual files.
5.
Because you changed the debug setting to false, you won't be able to debug the
application. instead, Press Ctrl-F5 to run the application. Check the network traffic,
which should look like Figure
5-12
.
Figure 5-12.
The final network activity