Как остановить sourcemaps/usemin от добавления тега css .map <link> к выводу?
gulp-usemin генерирует и добавляет тег ссылки css sourcemap для вывода html, но не делает для js. Как мне остановить добавление тега sourcemap?
Задание глотка:
gulp.task('build', function () {
return gulp.src('templates/**')
.pipe(usemin({
css: [sourcemaps.init({ loadMaps: true }), 'concat', cleanCss(), rev(), sourcemaps.write('./')],
js: [sourcemaps.init({ loadMaps: true }), 'concat', uglify(), rev(), sourcemaps.write('./')]
}))
.pipe(gulp.dest('public'));
});
Исходный HTML:
<!-- build:css css/style.min.css -->
<link href="css/main.css" rel="stylesheet" media="screen">
<link href="css/style.css" rel="stylesheet" media="screen">
<!-- endbuild -->
<!-- build:js js/script.min.js -->
<script src="js/main.js"></script>
<script src="js/script.js"></script>
<!-- endbuild -->
И это результат вывода. Обратите внимание на дополнительный тег css link sourcemap, но для JS-карт нет соответствующего тега сценария sourcemap. Почему так и как мне перестать вставлять тег sourcemap для css??
<link rel="stylesheet" href="css/style-cd92eb4ce7.min.css.map" media="screen"/>
<link rel="stylesheet" href="css/style-cd92eb4ce7.min.css" media="screen"/>
<script src="js/script-602bf332b2.min.js"></script>
2 ответа
Если вы посмотрите на исходный код gulp-usemin
Вы можете понять, почему это работает для JS, но не для CSS. gulp-usemin
явно создает только <script>
теги для файлов, которые заканчиваются .js
, Для CSS нет такой проверки.
Это может быть упущением со стороны gulp-usemin
сопровождающие, так что вы должны обязательно сообщить им об их трекере.
Если у вас нет абсолютно никакой другой возможности, и проблема не устранена в gulp-usemin
Сам, вот обходной путь:
var through = require('through2').obj;
var path = require('path');
var writeAndRemoveSourceMaps = through(function(file, enc, cb) {
if (path.extname(file.path) == '.map') {
gulp.dest('public').write(file, enc, cb);
return;
}
this.push(file);
cb();
});
gulp.task('build', function () {
return gulp.src('templates/**')
.pipe(usemin({
css: [
sourcemaps.init({ loadMaps: true }),
'concat',
cleanCss(),
rev(),
sourcemaps.write('./'),
writeAndRemoveSourceMaps // FINAL STAGE IN PIPELINE
],
js: [
sourcemaps.init({ loadMaps: true }),
'concat',
uglify(),
rev(),
sourcemaps.write('./')
]
}))
.pipe(gulp.dest('public'));
});
Выше добавлен еще один этап обработки writeAndRemoveSourceMaps
к css
трубопровод, сразу после sourcemaps.write()
подтолкнул .map
файл в поток. Этот этап вручную записывает .map
файл в каталог назначения, а затем снова удаляет его из потока, чтобы он не мог достичь gulp-usemin
и нет <link>
тег для него создан.
Благодаря ответу Свена я смог подать проблему, и сопровождающий выпустил исправление с помощью этого коммита почти сразу. Проблема больше не присутствует с v.0.3.25
,