Используйте gulp-useref, как добавить дополнительные файлы?
Я HTML-файл, как это:
...
<!-- build:js build/js/vendor.js -->
<script src="dep/angular/angular.js"></script>
<!-- endbuild -->
Создайте файл так:
<script src="build/js/vendor.xxxxxxxx.js"></script>
Сейчас пользуюсь gulp-angular-templatecache
упаковать все файлы представлений, сгенерировать template.js, я хотел бы добавить этот документ в скомпилированный HTML-файл внутри, как это сделать?
Я нашел gulp-useref
документ в additionalStreams
Настройки параметров, но я использовал, чтобы найти то, что не хочет достичь функции.
1 ответ
Я решил это по-другому.
Сначала напишите на странице:
<!-- build:templates --><!-- endbuild -->
Перед упаковкой с gulp-replace
заменен следующим образом:
<!-- build:js build/js/templates.js -->
<script src="build/js/templates.js"></script>
<!-- endbuild -->
Наконец-то унифицировать сборник.
Код:
var indexHtmlFilter = $.filter(['**/*', '!**/index_dev.html'], {
restore: true
});
var fontglyphiconsMatch = /^\.\.\/fonts\/glyphicons/;
var fontawesomeMatch = /^\.\.\/fonts\/fontawesome-/;
var imgMatch = /^\.\.\/img\//;
var matchUrlType = function(url){
if(fontglyphiconsMatch.test(url))
return url.replace(/^\.\./, '/dep/bootstrap-css-only');
if(fontawesomeMatch.test(url))
return url.replace(/^\.\./, '/dep/font-awesome');
if(imgMatch.test(url))
return url.replace(/^\.\./, '');
};
gulp.src('app/index_dev.html')
.pipe($.htmlReplace({
templates: `
<!-- build:js build/js/templates.js -->
<script src="build/js/templates.js"></script>
<!-- endbuild -->
`
}))
.pipe($.useref())
.pipe($.if('*.js', $.uglify({
output: {
ascii_only: true
}
})))
.pipe($.if('*.css', $.modifyCssUrls({
modify: matchUrlType
})))
.pipe($.if('*.css', $.cleanCss()))
.pipe(indexHtmlFilter)
.pipe($.rev())
.pipe($.revFormat({
prefix: '.'
}))
.pipe(indexHtmlFilter.restore)
.pipe($.revReplace())
.pipe($.if('*.html', $.htmlmin({
collapseWhitespace: true
})))
.pipe($.if('index_dev.html', $.rename('index.html')))
.pipe(gulp.dest('./app'));