Installing the CombineAndMinify package involves these
steps:
1.
Common installation - applies to all environments.
2.
IIS 7 related - only applies if your live site runs under IIS 7.
3.
IIS 6 related - only applies if your live site runs under IIS 6.
4.
Development environment related - only applies if you want to use the
package not just in your live site, but also in your development environment.
Common Installation
Compile the package:
1.
Download the zip file with the source code, and unzip in a directory.
2.
Open the CombineAndMinify.sln file in Visual
Studio 2008 or later.
3.
You'll find that the sources are organized in a solution, with these
elements:
·
Project CombineAndMinify is the actual package.
·
Web site Testsite contains a lot of (functional but rather
disorganised) test cases. Ignore this unless you want to test the
package.
4.
Compile the solution. This will produce a CombineAndMinify.dll
file in the CombineAndMinify\bin folder.
Update your web site:
1.
Add a reference to CombineAndMinify.dll to your web site (in Visual
Studio, right click your web site, choose Add Reference)
2.
Add the custom section combineAndMinify to
your web.config:
<configuration>
...
<configSections>
...
<section name=“combineAndMinify” type=“CombineAndMinify.ConfigSection”/>
...
</configSections>
...
</configuration>
Make head sections updatable
Allow the package to process the head sections of your
pages. That way, it can replace the tags loading individual JavaScript and CSS
files with tags loading combined files:
1.
Make sure that the head tags of your pages have runat=“server”,
like so:
When you create a new page in Visual Studio, it creates a
head section with runat=“server”, so you
probably don't have to change anything here.
2.
Add a folder called App_Browsers to the root
folder of your web site.
3.
Use your favorite text editor (such as Notepad) to create a text file in
the App_Browsers folder. Call it HeadAdapter.browser.
Into that file, copy and paste this code:
<browsers>
<browser refID=“Default”>
<controlAdapters>
<adapter controlType=“System.Web.UI.HtmlControls.HtmlHead”
adapterType=“CombineAndMinify.HeadAdapter” />
</controlAdapters>
</browser>
</browsers>
This tells ASP.NET to leave processing of all HtmlHead controls (which represent the head tags) to the
class CombineAndMinify.HeadAdapter (which is part of
the package).
Trust level Full
Make sure that your site has trust level Full. This allows
it to access the combineAndMinify section. If your
web.config contains
remove it. You'll than get the default trust level, which is
Full.
IIS 7
Only do these steps if you use IIS 7 for your live site or
your development environment. If you only use IIS 6 or IIS 7 in classic mode,
skip to the IIS 6 section.
The package uses an HTTP Handler to combine and minify
JavaScript and CSS files on the fly. To reduce CPU overhead, it caches the
combined files, so they only get combined and minified after they have been
changed on the file system.
To configure the HTTP Handler, add the following to your
web.config:
</configuration>
...
<system.webServer>
<validation validateIntegratedModeConfiguration=“false”/>
...
<handlers>
...
<add name=“JavaScriptHandler” verb=“*” path=“*.js”
type=“CombineAndMinify.HttpHandler, CombineAndMinify”
resourceType=“Unspecified”/>
<add name=“CssHandler” verb=“*” path=“*.css”
type=“CombineAndMinify.HttpHandler, CombineAndMinify”
resourceType=“Unspecified”/>
</handlers>
...
</system.webServer>
...
</configuration>
IIS 6
Only do these steps if you use IIS 6 or IIS 7 in classic
mode. If you use IIS 7, do the installation for IIS 7. If you want to invoke
the package not only in your live environment but your development environment
as well, than do the installation related to your development environment as
well.
1.
Configure the HTTP Handler in your web.config:
<configuration>
...
<system.web>
...
<httpHandlers>
...
<add verb=“*” path=“*.js” type=“CombineAndMinify.HttpHandler,
CombineAndMinify” />
<add verb=“*” path=“*.css” type=“CombineAndMinify.HttpHandler,
CombineAndMinify” />
</httpHandlers>
...
</system.web>
...
</configuration>
2.
Send all requests for JavaScript and CSS files to the ASP.NET handler.
That allows the package to combine and minify them.
a) Open the IIS Manager - click Start
| Administrative Tools | Internet
Information Services (IIS) Manager.
b) Expand your server. Expand Web Sites.
Right click your web site and choose Properties.
c) Click the Home Directory tab,
and then click the Configuration button.
d) Get the path to the ASP.NET handler:
·
Click the line with the .aspx extension.
·
Click the Edit button.
·
Copy the contents of the Executable
box. If you use .Net 2 or .Net 3.5, it will be C:\WINDOWS\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll.
·
Click Cancel to dismiss the dialog.
e) Tell IIS 6 to let ASP.NET handle all requests for files
with extension .js:
·
Click the Add button.
·
Paste the path to the ASP.NET handler you just found into the Executable field.
·
Enter .js into the Extension
field.
·
Uncheck the Verify that file exists
box.
·
Click OK.
f) Repeat the last step, but now for extension .css.
g) Click OK to dismiss the
Configuration dialog.
h) Click the Apply button, and
then click OK to dismiss the Properties
dialog.
Development Environment
By default, the package is only active when your site is in
Release mode - that is, if you have
<compilation debug=“false”>
in your web.config. That makes sense, because the package
doesn't affect the functionality of your site - it just makes it faster. If
this arrangement works for you, there is no need to do any installation related
to your development environment, so you can skip this section.
If you do want to activate the package in your development
environment, you need to run your debugging sessions under IIS 7, instead of under
Cassini (the web server that normally runs when you hit F5 in Visual Studio).
This is because the package uses an HTTP Handler to process JavaScript and CSS
files, and Cassini in .Net 3.5 doesn't support HTTP Handlers.
Note that IIS 7 is included in the Home Premium, Business,
Enterprise and Ultimate versions of Windows Vista and Win 7 (but not the
Starter and Home versions). That means you probably already have it on your
system.
Here is how to run your debugging sessions under IIS 7:
1.
Install IIS 7 on your development machine
2.
Create a development site in IIS 7
3.
Get Visual Studio to use IIS 7 instead of Cassini
4.
Do the installation steps related to IIS 7
5.
Make sure the package is active in debug mode
Let's go through these steps one by one.
1. Install IIS 7 on your development
machine
1.
Click Start | Control Panel
| Programs | Turn windows features
on or off.
2.
Check Internet Information Services.
3.
Expand the Internet Information Services node,
expand Web Management Tools and make sure IIS Management Console is checked. This will allow you to
run the IIS Manager.
4.
Expand IIS 6 Management Compatibility and make
sure IIS Metabase and IIS 6 configuration compatibility
is checked. You need this to be able to use IIS from Visual Studio.
5.
Expand the World Wide Web Services node and
then the Application Development Features node. Make
sure that ASP.NET is checked, so the server can run
ASP.NET applications.
6.
Also under World Wide Web Services, expand Security
and make sure Windows Authentication is selected.
You need this to be able to use IIS from Visual Studio.
7.
Click OK. Windows will take a while to
implement the changes.
2. Create a development site in IIS
Now that you have installed IIS 7 on your machine, create a
site in IIS 7 that Visual Studio can use for debugging sessions:
1.
While still in IIS Manager, expand your machine. Right click Sites and choose Add Web Site.
The Add Web Site dialog opens.
2.
Make up a site name. As the physical path, enter the root folder of your
source files – the one with default.aspx and web.config. Enter a port that
isn’t already in use, for example 1080. Click OK.
3.
Enable Windows Authentication. Double click your new site, double click Authentication, right click Windows
Authentication and choose Enable.
3. Get Visual Studio to use IIS 7 instead
of Cassini
If you use a Web Site:
1.
Run Visual Studio as administrator. Right click your web site and choose
Start Options. The Property Pages window opens, with
the Start Options tab selected.
2.
In the Server section, select Use custom server. In the Base Url
field, enter the localhost address with the port you entered when you created
the development site in IIS manager - for example http://localhost:1080.
3.
Click OK.
If you use a Web Application:
1.
In Visual Studio, right click the web application and choose Properties. The properties window opens.
2.
Click the Web tab.
3.
Scroll down to the Servers section and select Use Local IIS Web server. In the Project
Url field, enter the localhost address with the port you entered when
you created the development site in IIS manager.
4.
Save the properties.
Now when you hit F5 in Visual Studio to run your site in
debug mode, you'll find it runs under IIS 7 instead of under Cassini. Apart
from that, your debugging experience is the same - you can still set
breakpoints, etc.
4. Do the installation steps related to IIS
7
Now that you're using IIS 7 to do development, do the IIS 7
related installation if you have not already done that.
5. Make sure the package is active in debug
mode
To see how to do this, use the active
attribute in the combineAndMinify element, as
described in the Configuration section below.
