Встроенная среда AJAX и среда развертывания, особенно javascript и css min, полные версии - PullRequest
4 голосов
/ 06 октября 2011

В настоящее время у меня есть один сервер QA, на котором можно запустить svn update, чтобы протестировать код, который каждый совершает в subversion.Проблема, с которой я сталкиваюсь при использовании все большего количества javascript и css, заключается в том, что минимальная или полная версия компилируется, например:

  • Инструмент сборки: Jake
  • Компрессор JS: UglifyJS
  • Оптимизатор CSS: CSSO

либо нужно обновить / скомпилировать вручную перед продвижением на рабочие серверы, либо у нас просто есть минимальная / полная версия на нашем SVN, но это было бы не так уж и здорово.Я вижу подход, который заключается в следующем: * храните файлы сценариев javascript full / split css вне пути, по которому размещается контент, обслуживаемый через Интернет, subversion или trac создает минимальную / полную версию для submit / trigger.

Имееткто-нибудь еще автоматизировал этот процесс?Как вы разделяете полную версию / полную версию / минимальную версию, чтобы не испортить окончательное развертывание?Когда вы компилируете мин версию?Только на последнем этапе, прежде чем идти в производство?Где вы оставляете исходный источник, он не может жить прямо рядом с другими файлами, в моем случае php файлы?

Ответы [ 2 ]

0 голосов
/ 12 октября 2011

Я выбрал следующий основанный на соглашениях подход, и он хорошо подходит для традиционной веб-разработки, а также для мобильных приложений и автономных мобильных приложений HTML5.

Условные обозначения

  • Все неминифицированные / полные версии сценариев js / css имеют имена с расширениями .debug.js или .debug.css. Пример: global.debug.js и global.debug.css
  • Все ссылки на js / css в html-ссылках на не отладочные версии: global.js или global.css

Процесс

  • Я использую пользовательскую задачу MSBuild для минимизации js (используя AjaxMin, но вы можете использовать YUI Compressor или другие) в соответствии со следующим соглашением об именах * .release.js или * .release.css (Пример: global.release.js).
  • После минификации в файлы * .release.js. У меня есть еще одна задача MSBuild, которая вызывает простой пакетный файл (JS.bat), который принимает текущую конфигурацию (Debug или Release) и копирует либо отладочную (версия с полным исходным кодом), либо выпускную (минимизированную) версию в обычное место назначения.

Вот примеры задач MSBuild, которые я добавляю в файл своего проекта, чтобы выполнить минификацию и вызывать мой пакетный файл:

  <Import Project="$(MSBuildExtensionsPath)\Microsoft\MicrosoftAjax\ajaxmin.tasks" />
  <Target Name="AfterBuild">
    <ItemGroup>
      <DebugJS Include="**\*.debug.js" />
    </ItemGroup>
    <AjaxMin SourceFiles="@(DebugJS)" SourceExtensionPattern="\.debug.js$" TargetExtension=".release.js" />
    <Exec Command="JS.bat $(Configuration)" />
  </Target>

Например, предполагая:

  • Я в режиме отладки
  • и у меня есть файл global.debug.js (версия с полным исходным кодом, в которой я работаю)
  • Когда я собираю свой проект, global.debug.js становится минимизированным в global.release.js
  • Поскольку я нахожусь в конфигурации режима отладки, global.debug.js будет скопирован в global.js (на что ссылается мой html), и поэтому у меня будет версия с полным исходным кодом при отладке
  • Если я переключусь на конфигурацию режима выпуска, то global.release.js (минимизированная версия) будет скопирован в global.js, и это то, что я хотел бы для выпуска / развертывания в производство.

Вот простой пакетный скрипт (JS.bat), который я использую для обработки копии сценария отладки или выпуска на основе переданного аргумента:

@Echo off
REM ----------------------------------------------------------------------------------------
REM <summary>
REM     Script used to copy the Debug (or Release) javascript files to the runtime location
REM </summary>
REM <history>
REM     <change date="9/22/2010" author="Adam Anderly">Created</change>
REM </history>
REM ----------------------------------------------------------------------------------------
REM Grab the first argument as variable Config (Debug/Release)
SET Config=%~1
REM The loop below is used to get the Length of the Config variable
REM The Length variable is then used in the substring function on Line 22
for /f "tokens=1 delims=:" %%a in ( 
 '^(echo."%Config%"^& echo.!@#^)^|findstr /O /C:"!@#" ' 
) do set /a Length=%%a-5 + 4
FOR /R %%i IN (*.%Config%.js) DO CALL :REN "%%i"
GOTO :END
:REN
    SET File=%~f1
    REM Set File2 variable to the runtime filename (minus .debug or .release)
    CALL SET File2=%%File:~0,-%Length%%%.js
    REM First make sure the destination file is not read-only
    IF EXIST "%File2%" ATTRIB /S -R "%File2%"
    REM Finally, we copy the current debug|release file to the runtime file
    COPY /Y "%File%" "%File2%"
:END

Пакетный скрипт выше работает рекурсивно, поэтому вы можете иметь вложенные папки js или css, и он все еще работает.

Хотя я использую MSBuild, вы, безусловно, можете включить этот пакетный файл в свой процесс, используя другой инструмент сборки (ранее я делал то же самое с помощью NAnt).

Надеюсь, это поможет!

Адам * * тысяча пятьдесят-одна

0 голосов
/ 11 октября 2011

Просто сам имел дело с чем-то похожим. Если я правильно понимаю ваш вопрос, вы ищете неинициализированные файлы в локальной или dev-среде, но минимизируете их при развертывании. Конечно, есть много разных способов сделать это, и в настоящее время мы работаем над лучшим решением, но я приведу пример проекта, который я только что закончил ...

Использует Symfony 1.4, YUI Compressor и git.

У меня есть задача symfony (скрипт php cli), настроенная для запуска YUI Compressor для заданного списка файлов css и js, которые выгружаются в min.css и min.js в соответствующих каталогах. Сценарий просто сбрасывает все содержимое перечисленных файлов в один большой файл и минимизирует их. Тогда Symfony будет использовать только min.js. Конечно, отладка свернутых файлов может быть затруднена, поэтому другой вариант - пропустить минификацию локальных окон или окон разработчиков и просто сохранить их как объединенный файл. Лично у меня это все равно минимизируется, потому что Chrome "Pretty print" работает достаточно хорошо для меня большую часть времени, хотя и не "идеально".

Я создал локальный сценарий post-commit и server-post-merge для git, который просто запускает задачу symfony, так что файлы автоматически обновляются, когда вы делаете локальный коммит или выполняете git pull на сервере, поэтому любые изменения сделаны внутри файлов js / css обновляются при фиксации. Единственная проблема в том, что вам нужно вручную запускать скрипт minify всякий раз, когда вы обновили локально, но еще не зафиксировали.

В качестве альтернативы для хранения неинициализированного кода в локальном / dev потребовалось бы дополнительное кодирование, чтобы оно зависело от конкретной среды, что, безусловно, выполнимо, но я просто ленив с этим, пока это работает достаточно хорошо:)

...