在Visual Studio 2010中使用Microsoft AJAX Minifier一键式发布

Question

在微软的AJAX Minifier提供了一个构建任务,可以在TFS或本地构建定义使用.

我在本地项目文件(构建到单独的文件)和TFS构建定义(覆盖现有的JS文件)中都使用了这个.

我想转而使用Visual Studio 2010的一键发布功能而不是TFS构建定义,但是在项目文件中将缩小任务添加为AfterBuild目标似乎不会影响单击发布功能.

使用此线程和这些 文章中的信息,我尝试在我的WAP根目录中创建一个名为"[ProjectName] .wpp.targets的文件,并使用以下XML:

<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">
<Import Project="$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\ajaxmin.tasks" />
<Target Name="Minify" BeforeTargets="MSDeployPublish">
    <ItemGroup>
      <JS Include="**\*.js" Exclude="**\*.min.js;**\*vsddoc.js;**\*debug.js" />
    </ItemGroup>
    <ItemGroup>
      <CSS Include="**\*.css" Exclude="**\*.min.css" />
    </ItemGroup>
    <AjaxMin JsSourceFiles="@(JS)" JsSourceExtensionPattern="\.js$" JsTargetExtension=".min.js" CssSourceFiles="@(CSS)" CssSourceExtensionPattern="\.css$" CssTargetExtension=".min.css" />
  </Target>
</Project>

这似乎没有任何效果,不幸的是,Visual Studio对这些工具的反馈或调试信息没有太多帮助.

有没有人使用Visual Studio 2010一键发布功能来缩小JavaScript/CSS？

Answer 1

我刚刚在http://sedodream.com/2011/02/25/HowToCompressCSSJavaScriptBeforePublishpackage.aspx和http://blogs.msdn.com/b/webdevtools/archive/2011/02上写了一篇关于如何做到这一点的详细博客文章. /24/how-to-compress-css-javascript-before-publish-package.aspx.

这是内容

今天我在stackoverflow.com上看到一篇帖子,要求使用Microsoft AJAX Minifier和Visual Studio 2010一键发布.这是对这个问题的回应.Web Publishing Pipeline非常广泛,因此我们很容易将其挂钩以执行这些操作.其中一个扩展点,正如我们之前发表的博客,正在创建一个.wpp.targets文件.如果在项目的同一目录中使用名称{ProjectName} .wpp.targets创建文件,则该文件将自动导入并包含在构建/发布过程中.这样可以轻松编辑构建/发布过程,而无需始终编辑项目文件.我将使用此技术演示如何压缩项目在发布/打包之前包含的CSS和JavaScript文件.

虽然问题明确指出Microsoft AJAX Minifier我决定使用Packer.NET中包含的压缩器(资源部分中的链接).我这样做是因为当我查看AJAX Minifier的MSBuild任务时,它看起来不像我可以控制压缩文件的输出位置.相反,它只是用.min.cs或.min.js这样的扩展名写入同一个文件夹.在任何情况下,当您发布/打包Web应用程序项目(WAP)时,文件将在发布/包发生之前复制到临时位置.此位置的默认值为obj {Configuration}\Package\PackageTmp \,其中{Configuration}是您当前用于WAP的构建配置.所以我们需要做的是允许WPP将所有文件复制到该位置,然后我们可以压缩该文件夹中的CSS和JavaScript.将文件复制到该位置的目标是CopyAllFilesToSingleFolderForPackage.(要了解有关这些目标的更多信息,请查看文件%Program Files(x86)%\ MSBuild\Microsoft\VisualStudio\v10.0\Web\Microsoft.Web.Publishing.targets.)使目标在此目标之后运行我们可以使用MSBuild AfterTargets属性.我为展示这个而创建的项目叫做CompressBeforePublish,因为我创建了一个名为CompressBeforePublish.wpp.targets的新文件来包含我的更改.

<Project xmlns="http://schemas.microsoft.com/developer/msbuild/2003">

  <UsingTask TaskName="SmallSharpTools.Packer.MSBuild.Packer"
             AssemblyFile="$(MSBuildThisFileDirectory)..\Contrib\SmallSharpTools.Packer\SmallSharpTools.Packer.dll" />

  <!-- This target will run after the files are copied to PackageTmp folder -->
  <Target Name="CompressJsAndCss" AfterTargets="CopyAllFilesToSingleFolderForPackage">
    <!-- Discover files to compress -->
    <ItemGroup>
      <_JavaScriptFiles Include="$(_PackageTempDir)\Scripts\**\*.js" />
      <_CssFiles Include="$(_PackageTempDir)\Content\**\*.css" />
    </ItemGroup>

    <Message Text="Compressing JavaScript files" Importance="high" />
    <!-- 
      Compress the JavaScript files. 
      Not the usage of %(JavaScript.Identity which causes this task to run once per
      .js file in the JavaScriptFiles item list.
      For more info on batching: http://sedotech.com/resources#Batching
    -->
    <Packer InputFiles="%(_JavaScriptFiles.Identity)"
            OutputFileName="@(_JavaScriptFiles->'$(_PackageTempDir)\Scripts\%(RecursiveDir)%(Filename)%(Extension)')"
            Mode="JSMin"
            Verbose="false"
            Condition=" '@(_JavaScriptFiles)' != ''" />

    <Message Text="Compressing CSS files" Importance="high" />

    <Packer InputFiles="%(_CssFiles.Identity)"
            OutputFileName="@(_CssFiles->'$(_PackageTempDir)\Content\%(RecursiveDir)%(Filename)%(Extension)')"
            Mode="CSSMin"
            Verbose="false"
            Condition=" '@(_CssFiles)' != '' "/>
  </Target>
</Project>

在这里,我创建了一个目标CompressJsAndCss,并且我已经包含了AfterTargets ="CopyAllFilesToSingleFolderForPackage",这使得它在CopyAllFilesToSingleFolderForPackage之后执行.在这个目标里面,我做了两件事,收集需要压缩的文件,然后压缩它们.

1.收集要压缩的文件

<ItemGroup>
  <_JavaScriptFiles Include="$(_PackageTempDir)\Scripts\**\*.js" />
  <_CssFiles Include="$(_PackageTempDir)\Content\**\*.css" />
</ItemGroup>

在这里,我使用JavaScript文件和CSS文件的项目列表.请注意,我使用_PackageTempDir属性来拾取写入文件的临时文件夹中的.js和.css文件以进行打包.我之所以这样做而不是选择源文件是因为我的构建可能正在输出其他.js和.css文件,这些文件将被发布.注意:由于属性_PackageTempDir以下划线开头,因此无法保证在将来的版本中表现(甚至存在).

2.压缩文件

我使用Packer任务来压缩.js和.css文件.对于这两组文件,使用情况非常相似,所以我只看第一次使用.

<Packer InputFiles="%(_JavaScriptFiles.Identity)"
        OutputFileName="@(_JavaScriptFiles->'$(_PackageTempDir)\Scripts\%(RecursiveDir)%(Filename)%(Extension)')"
        Mode="JSMin"
        Verbose="false"
        Condition=" '@(_JavaScriptFiles)' != ''" />

这里的任务被送入所有.js文件进行压缩.请注意我是如何使用%(_ JavaScriptFiles.Identity)将文件传递给任务的,在这种情况下,这样做是为了使每个.js文件执行一次此任务.%(abc.def)语法调用批处理,如果您不熟悉批处理,请参阅下文.对于输出文件的值,我再次使用_PackageTempDir属性.在这种情况下,由于项目已经存在于那里,我可以将其简化为@(_ JavaScriptFiles - >'%(FullPath)')但我认为您可能会发现该表达式在您压缩尚不存在的文件的情况下很有用在_PackageTempDir文件夹中.

现在我们已将此目标添加到.wpp.targets文件中,我们可以发布/打包我们的Web项目,并且压缩包含的.js和.css文件.注意:每当修改.wpp.targets文件时,您都必须卸载/重新加载Web项目,以便获取更改,Visual Studio会缓存您的项目.

在下图中,您可以看到压缩这些文件的区别.

您可以在下面下载整个项目,也可以查看我可能感兴趣的其他一些资源.

资源

• http://sedotech.com/content/samples/CompressBeforePublish.zip
• http://sedotech.com/resources#batching
• MSBuild BeforeTargets/AfterTargets
• WebDeploymentToolMSDeployHowToExcludeFilesFromPackageBasedOnConfiguration.aspx
• Packer.NET