День добрый.
Расскажу про отличный gulp плагин для сборки вашего веб приложения в один большой ассет, который может путешествовать отдельно на любой хост в удобном виде, а также если вы используете непрерывное развертывание, то можно собирать ассеты прямо в Jenkins например.
Итак сначала начнем с перечисления всех необходимых плагинов:
var gulp = require('gulp'),
clean = require('gulp-clean'), //для чистки папки dist
inject = require('gulp-inject'), //этим мы будем инжектить исходники проекта поотдельности для рабаты в dev режиме
bundle = require('gulp-bundle-assets'), //тот самый очень полезный плагин
config = require('load-gulp-config'), //для загрузки json конфигураций на выходе из предыдущего плагина
htmlreplace = require('gulp-html-replace'); //этим мы будем вставлять считанныйе из json бандлы в наш html
bundle-assets — отличный плагин т.к он позволяет создать отделную dist директорию со всеми шрифтами, картинками, стилями и т.д, которые необходимы для работы приложения. Пример использования плагина можно посмотреть по ссылке.
Коротко говоря на выходе мы получаем вот такой bundle.result.json, все исходини уже минимизированы и могут располагатся где вам угодно:
{
"main": {
"styles": "<link href='main-8e6d79da08.css' media='screen' rel='stylesheet' type='text/css'/>",
"scripts": "<script src='main-5f17cd21a6.js' type='text/javascript'></script>"
},
"vendor": {
"scripts": "<script src='vendor-d66b96f539.js' type='text/javascript'></script>",
"styles": "<link href='vendor-23d5c9c6d1.css' media='screen' rel='stylesheet' type='text/css'/>"
}
}
Читать полностью »
