Использование Microsoft AJAX Minifier с Visual Studio 2010 одним щелчком мыши опубликовать

Question

Microsoft AJAX Minifier предоставляет задачу сборки, которую можно использовать в определениях TFS или локальной сборки.

Я успешно использовал это как в локальном файле проекта (сборка для разделения файлов), так и в определениях сборки TFS (перезаписывая существующие файлы JS).

Я бы хотел перейти к использованию функции публикации одним щелчком в Visual Studio 2010, а не к определению сборки TFS, однако добавление задачи минимизации в качестве цели AfterBuild в файл проекта, по-видимому, не влияет на функцию публикации в один щелчок.

Используя информацию, найденную в этой теме и в этих статьях, я попытался создать файл с именем '[ProjectName].wpp.targets в моем корневом каталоге WAP и использовал следующий 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 не дает много обратной связи или информации отладки для этих инструментов.

Кто-нибудь добился успеха в минимизации JavaScript / CSS с помощью функции публикации в 1 клик в Visual Studio 2010?

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.

Вот содержимое

Сегодня я увидел сообщение на stackru.com с просьбой использовать Microsoft AJAX Minifier с Visual Studio 2010, публикация в один клик. Это ответ на этот вопрос. Трубопровод веб-публикаций довольно обширный, поэтому нам легко подключиться к нему для выполнения таких операций. Как мы уже писали в блоге, одной из таких точек расширения является создание файла.wpp.targets. Если вы создадите файл в том же каталоге вашего проекта с именем {ProjectName}.wpp.targets, то этот файл будет автоматически импортирован и включен в процесс сборки / публикации. Это позволяет легко редактировать процесс сборки / публикации без необходимости всегда редактировать сам файл проекта. Я буду использовать эту технику, чтобы продемонстрировать, как сжимать файлы CSS и JavaScript, содержащиеся в проекте, до его публикации / упаковки.

Несмотря на то, что в вопросе конкретно говорится о Microsoft AJAX Minifier, я решил использовать компрессор, содержащийся в Packer.NET (ссылка в разделе ресурсов). Я сделал это, потому что когда я смотрел на задачу MSBuild для AJAX Minifier, это не выглядело так, как будто я мог контролировать расположение вывода сжатых файлов. Вместо этого он будет просто записывать в ту же папку с расширением, например.min.cs или.min.js. В любом случае, когда вы публикуете / упаковываете свой проект веб-приложений (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, мы можем опубликовать / упаковать наш веб-проект, и содержащиеся в нем файлы.js & .css будут сжаты. Примечание. Всякий раз, когда вы изменяете файл.wpp.targets, вам придется выгружать / перезагружать веб-проект, чтобы изменения были приняты, Visual Studio кэширует ваши проекты.

На изображении ниже вы можете увидеть разницу, которую сделали эти файлы.

Вы можете скачать весь проект ниже, а также взглянуть на некоторые другие ресурсы, которые у меня есть, которые могут вас заинтересовать.

Ресурсы

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

Answer 2

Чтобы это работало в Visual Studio 2015, мы должны изменить "AfterTarget" с

<Target Name="CompressJsAndCss" AfterTargets="CopyAllFilesToSingleFolderForPackage">

к следующему

<Target Name="CompressJsAndCss" AfterTargets="PipelineCopyAllFilesToOneFolderForMsdeploy">

наслаждаться!!