Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>I use a customized solution based on MSBuild and the Microsoft Ajax Minifier. Much of the existing blog posts out there don't correctly handle certain cases such as integration with TFS build.</p> <p>For each web project, we create a "wpp.targets" file to extend the Web Publishing Pipeline. For example, if the project is "Website.csproj" create a file named "Website.wpp.targets" in the project.</p> <p>Place the following code in the targets file:</p> <pre><code>&lt;Project DefaultTargets="Build" xmlns="http://schemas.microsoft.com/developer/msbuild/2003"&gt; &lt;Import Project="$(MSBuildExtensionsPath32)\PATH TO YOUR MSBUILD MINIFY TARGETS" /&gt; &lt;!-- Hook up minification task to WPP build process --&gt; &lt;PropertyGroup&gt; &lt;OnAfterPipelineTransformPhase&gt; $(OnAfterPipelineTransformPhase); MinifyResourceFiles; &lt;/OnAfterPipelineTransformPhase&gt; &lt;/PropertyGroup&gt; &lt;!-- Define temporary location to store minified resources --&gt; &lt;PropertyGroup&gt; &lt;MinifyResourceIntermediateOutput Condition="'$(MinifyResourceIntermediateOutput)'==''"&gt;MinifyResourceFiles&lt;/MinifyResourceIntermediateOutput&gt; &lt;MinifyResourceIntermediateLocation Condition="'$(MinifyResourceIntermediateLocation)'==''"&gt;$(_WPPDefaultIntermediateOutputPath)$(MinifyResourceIntermediateOutput)&lt;/MinifyResourceIntermediateLocation&gt; &lt;/PropertyGroup&gt; &lt;Target Name="MinifyResourceFiles" DependsOnTargets="PipelineCollectFilesPhase" Condition="'$(Configuration)' == 'Release'"&gt; &lt;!-- Create lists of the resources to minify --&gt; &lt;!-- These extract all Javascript and CSS files from the publishing pipeline "FilesForPackagingFromProject" and create two new lists. The "MinifiedFile" metadata on each item contains the temporary location where the minified file will be stored --&gt; &lt;ItemGroup&gt; &lt;JavaScriptToMinify Include="@(FilesForPackagingFromProject)" Condition="'%(FilesForPackagingFromProject.Extension)' == '.js'"&gt; &lt;MinifiedFile&gt;$(MinifyResourceIntermediateLocation)\minified\%(DestinationRelativePath)&lt;/MinifiedFile&gt; &lt;/JavaScriptToMinify&gt; &lt;StylesheetToMinify Include="@(FilesForPackagingFromProject)" Condition="'%(FilesForPackagingFromProject.Extension)' == '.css'"&gt; &lt;MinifiedFile&gt;$(MinifyResourceIntermediateLocation)\minified\%(DestinationRelativePath)&lt;/MinifiedFile&gt; &lt;/StylesheetToMinify&gt; &lt;/ItemGroup&gt; &lt;!-- Minify resources --&gt; &lt;!-- These commands should be replaced with the MSBuild Tasks used to perform your minification I use my own custom tasks based on the Microsoft Ajax Minifier DLL The input of the minifier takes a source file directly from the project and outputs to a temporary location --&gt; &lt;MinifyJavaScript SourceFiles="@(JavaScriptToMinify)" DestinationFiles="@(JavaScriptToMinify-&gt;'%(MinifiedFile)')" Comments="None" /&gt; &lt;MinifyStylesheet SourceFiles="@(StylesheetToMinify)" DestinationFiles="@(StylesheetToMinify-&gt;'%(MinifiedFile)')" Comments="None" /&gt; &lt;!-- Remove the original source files from the packaging system and include the new minfied resources from the temporary location --&gt; &lt;ItemGroup&gt; &lt;!--Remove unminified resources from the pipeline --&gt; &lt;FilesForPackagingFromProject Remove="@(JavaScriptToMinify)" Condition="'@(JavaScriptToMinify)' != ''" /&gt; &lt;FilesForPackagingFromProject Remove="@(StylesheetToMinify)" Condition="'@(StylesheetToMinify)' != ''" /&gt; &lt;!--Add the minified resources at the new loction to the pipeline --&gt; &lt;FilesForPackagingFromProject Include="@(JavaScriptToMinify-&gt;'%(MinifiedFile)')" Condition="'@(JavaScriptToMinify)' != ''"/&gt; &lt;FilesForPackagingFromProject Include="@(StylesheetToMinify-&gt;'%(MinifiedFile)')" Condition="'@(StylesheetToMinify)' != ''"/&gt; &lt;/ItemGroup&gt; &lt;/Target&gt; &lt;/Project&gt; </code></pre> <p>The "'$(Configuration') == 'Release'" condition on the minification target can be modified depending on your needs. It will automatically minify (and validate) all CSS and JS files in the project when publishing, packaging, and building on the server.</p> <p>You may need to enable the WPP "CopyWebApplication" target for server builds. To do this, set the MSBuild property UseWP_CopyWebApplication to True, and PipelineDependsOnBuild to False. We set these in the project file, before the web application targets file is included.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload