Использование Microsoft AJAX Minifier с Visual Studio 2010 одним щелчком мыши опубликовать - PullRequest
12 голосов
/ 18 февраля 2011

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 с помощью функции публикации одним щелчком в Visual Studio 2010?

Ответы [ 2 ]

22 голосов
/ 25 февраля 2011

Я только что написал подробную запись в блоге о том, как это сделать, на 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 одним щелчком мыши опубликовать.Это ответ на этот вопрос.Трубопровод веб-публикаций довольно обширный, поэтому нам легко подключиться к нему для выполнения таких операций.Одна из таких точек расширения, о которой мы писали ранее, - это создание файла .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 кэширует ваши проекты.

На изображении ниже вы можете увидеть разницучто сжатие этих файлов сделано.enter image description here

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

Ресурсы

0 голосов
/ 01 июля 2016

Для того, чтобы это работало в Visual Studio 2015, нам нужно изменить «AfterTarget» с

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

до следующего

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

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

...