Основным нововведением в новой версии Bundle Transformer стала поддержка языка TypeScript. Кроме того, были внесены изменения в ядро продукта и в следующие модули: BundleTransformer.MicrosoftAjax, BundleTransformer.Yui и BundleTransformer.Csso.
Рассмотрим основные нововведения данной версии:
Ядро
В BundleTransformer.Core появилась возможность отказаться от использования предварительно минимизированных файлов (например, файлы с расширениями *.min.css
и *.min.js
) и производить минимизацию кода исключительно средствами выбранного минимизатора. За включение/отключение использования предварительно минимизированных файлов отвечают атрибуты usePreMinifiedFiles
конфигурационных элементов css
и js
. В следующем примере показан код, отключающий использование предварительно минимизированных файлов.
<?xml version="1.0" encoding="utf-8"?>
<configuration>
...
<bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
<core>
<css usePreMinifiedFiles="false">
...
</css>
<js usePreMinifiedFiles="false">
...
</js>
...
</core>
...
</bundleTransformer>
...
</configuration>
По умолчанию атрибутам usePreMinifiedFiles
присвоены значения равные true
.
Данная возможность пригодится тем разработчикам, которые хотят применить ко всему CSS- и/или JS-коду своего веб-приложения алгоритмы минимизации, обладающие наивысшей степенью сжатия. Но следует помнить, что некоторые JS-библиотеки не получится сжать без ошибок. Кроме того, объем сжимаемого кода увеличится, что приведет увеличению продолжительности минимизации на лету.
Трансляторы
Bundle Transformer: TypeScript
Модуль BundleTransformer.TypeScript содержит адаптер-транслятор TypeScriptTranslator
, производящий трансляцию TypeScript-кода в JavaScript. Если вы еще ничего не слышали о TypeScript, то рекомендую вам прочитать следующие статьи: «TypeScript: язык для разработки больших приложений на JavaScript» Анатолия Ализара и «TypeScript для ASP.NET MVC 4 веб-приложений» Андрея Веселова.
Параметры компиляции TypeScript-кода можно настроить с помощью конфигурационной секции typeScript
в файле Web.config
:
<?xml version="1.0" encoding="utf-8"?>
<configuration>
...
<bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
<typeScript useNativeMinification="false" useDefaultLib="true"
propagateConstants="false" errorOnWith="true"
inferPropertiesFromThisAssignment="false"
codeGenTarget="EcmaScript3">
<style bitwise="false" blockInCompoundStatement="false"
eqEqEq="false" forIn="false" emptyBlocks="true"
newMustBeUsed="false" requireSemicolons="false"
assignmentInConditions="false" eqNull="false"
evalOk="true" innerScopeDeclarationsEscape="true"
functionsInLoops="true" reDeclareLocal="true"
literalSubscript="true" implicitAny="false" />
</typeScript>
...
</bundleTransformer>
...
</configuration>
Названия и возможные значения большего количества свойств совпадают с конфигурационными свойствами исходного компилятора, поэтому я рассмотрю свойства, назначение которых может быть не очевидно:
useNativeMinification="(true|false)"
. Разрешает минимизацию генерируемого JS-кода средствами TypeScript-компилятора. При встроенной минимизации производится удаление пробельных символов и комментариев. Сжатый таким образом код уже не подвергается минимизации средствами модуля-минимизатора, поэтому использовать встроенную минимизацию следует только в случаях, когда по каким-то причинам использование модуля-минимизатора невозможно. Данное конфигурационное свойство управляет сразу двумя свойствами компилятора:minWhitespace
иemitComments
.useDefaultLib="(true|false)"
. Разрешает загрузку в компилятор определений общих типов, объявленных в файлеlib.d.ts
. К общим типам относятся основные типы из ECMAScript, DOM и Windows Script Host.
Чтобы скомпилировать код TS-файла, в котором используются типы, объявленные в других файлах, вам необходимо добавить в код ссылки на эти файлы. Ссылки на файлы добавляются с помощью документирующих тегов <reference>
(более подробную информацию о данном теге вы можете прочитать в статье «Облегчаем работу с JS- и CSS-кодом в Visual Studio»).
/// <reference path="jquery.d.ts" />
/// <reference path="TranslatorBadge.ts" />
/// <summary>
/// Creates colored badge for translator
/// </summary>
;class ColoredTranslatorBadge extends TranslatorBadge {
public getTextColor(): string {
/// <summary>
/// Gets a text color of badge
/// </summary>
/// <returns type="String">
/// Text color of badge
/// </returns>
return this.$linkElem.css("color");
}
public setTextColor(color: string): void {
/// <summary>
/// Sets a text color of badge
/// </summary>
/// <param name="color" type="String">
/// Text color of badge
/// </param>
this.$linkElem.css("color", color);
}
public getBorderColor(): string {
/// <summary>
/// Gets a border color of badge
/// </summary>
/// <returns type="String">
/// Border color of badge
/// </returns>
return this.$badgeElem.css("border-color");
}
public setBorderColor(color: string) {
/// <summary>
/// Sets a border color of badge
/// </summary>
/// <param name="color" type="String">
/// Border color of badge
/// </param>
this.$badgeElem.css("border-color", color);
}
}
В приведенном выше коде с помощью документирующих тегов <reference>
добавляются ссылки на файлы jquery.d.ts
и TranslatorBadge.ts
.
Минимизаторы
Bundle Transformer: Microsoft Ajax
В модуле BundleTransformer.MicrosoftAjax была обновлена библиотека Microsoft Ajax Minifier до версии 4.69.
Bundle Transformer: YUI
В BundleTransformer.Yui была обновлена библиотека YUI Compressor for .Net до версии 2.1.0.0.
Bundle Transformer: CSSO
В BundleTransformer.Csso (x86, x64) был обновлен код минимизатора CSSO до версии 1.3.4.
Автор: Taritsyn