Может ли Grunt wiredep wire минимизировать версию в файле HTML
Можно ли внедрить минимизированную версию зависимостей в HTML-страницы с помощью плагина Grunt wiredep?
3 ответа
Это можно сделать, переопределив параметр wiredep fileTypes в вашей конфигурации Gruntfile.js.
Следующее заменяет (переименовывает) все имена файлов *.js на *.min.js:
wiredep: {
task: {
src: [
'public_html/**/*.html', // .html support...
// ...
],
},
fileTypes: {
html: {
block: /(([ \t]*)<!--\s*bower:*(\S*)\s*-->)(\n|\r|.)*?(<!--\s*endbower\s*-->)/gi,
detect: {
js: /<script.*src=['"]([^'"]+)/gi,
css: /<link.*href=['"]([^'"]+)/gi
},
replace: {
js: function(filePath) {
var filePathStrArr = filePath.split('.');
var filePathStr = ''; //filePathStrArr[filePathStrArr.length-2];
if (filePathStrArr[filePathStrArr.length - 2] != 'min') {
filePathStrArr.pop();
filePathStr = filePathStrArr.join('.') + '.min.js';
if(!grunt.file.exists(filePathStr)){
//console.log('warning - file does not exist:'+filePathStr);
filePathStr = filePath; //if the .min.js file does not exist then revert back to original filename
}
} else {
filePathStr = filePath;
}
return '<script src="' + filePathStr + '"></script>';
},
css: '<link rel="stylesheet" href="{{filePath}}" />'
}
}
}
}
Обратите внимание, что это предполагает наличие файла *.min.js во всех местах вашего javascript.
На данный момент это невозможно.
Основное использование grunt-wiredep - это простое добавление зависимостей от вашей беседки.
Если вы хотите минимизировать ваши файлы bower, я рекомендую вам использовать grunt-usemin или grunt-html-build. Вы можете минимизировать все ваши зависимости bower в одном файле.
Например, с помощью grunt-usemin вы должны сделать это.
<!-- build:js js/vendor.js -->
<!-- bower:js -->
<!-- endbower -->
<!-- endbuild -->
С уважением.
Рабочая версия ответа EdC, (не смог заставить его работать, но это вдохновило меня написать это) плюс улучшение для обработки случая, когда .min.js
Файл предоставляется в другом месте будет:
task: {
src:'public_html/**/*.html',
fileTypes: {
html: {
block: /(([ \t]*)<!--\s*bower:*(\S*)\s*-->)(\n|\r|.)*?(<!--\s*endbower\s*-->)/gi,
detect: {
js: /<script.*src=['"]([^'"]+)/gi,
css: /<link.*href=['"]([^'"]+)/gi
},
replace: {
js: function(filePath) {
var filePathStr = '', path = require('path'), pattern = /min.js/g;
// libDirectory would always be 'bower_components/libname'
var libDirectory = filePath.split('/').slice(0,2).join('/');
var minFilename = path.posix.basename(filePath).replace('.js','.min.js');
if (!pattern.test(filePath)) {
if(!grunt.file.exists(filePath.replace('.js','.min.js'))){
// need to have the normal lib file in case min version wasn't available at all
filePathStr = filePath;
// recursively executes the callback function for every file in lib directory(libDirectory)
grunt.file.recurse(libDirectory, function callback(abspath, rootdir, subdir, filename) {
if( filename === minFilename )
filePathStr = abspath;
});
} else {
// if min exists in the same dir then so be it
filePathStr = filePath.replace('.js','.min.js');
}
} else {
// some packages main attribute is pointed to min version already
filePathStr = filePath;
}
return '<script src="' + filePathStr + '"></script>';
},
css: '<link rel="stylesheet" href="{{filePath}}" />'
}
}
}
}