我试图执行以下操作:
看起来像这样:
gulp.task('styles', function() {
var streamCSS = gulp.src(sources.css)
.pipe(sourcemaps.init())
.pipe(concat('vendor.css'))
.pipe(cmq())
.pipe(minify({ keepSpecialComments: '*' }))
.pipe(sourcemaps.write());
var streamLESS = gulp.src(sources.less)
.pipe(plumber({ errorHandler: errorHandler }))
.pipe(sourcemaps.init())
.pipe(less())
.on('error', swallowError)
.pipe(cmq())
.pipe(minify({ keepSpecialComments: '*' }))
.pipe(sourcemaps.write())
.pipe(prefix("last 2 versions", "> 1%", "ios >= 6", { map: true }))
.on('error', swallowError);
return es.merge(streamCSS, streamLESS)
.pipe(plumber({ errorHandler: errorHandler }))
.pipe(concat('main.css'))
.pipe(gulp.dest(destinations.css))
.pipe(connect.reload());
});
我遇到的唯一问题是生成的源图是错误的,并且总是引用错误的LESS文件。
我使用以下库来实现这一目标:
我知道如果我省略供应商的东西会有用,但我希望只有一个结果样式表。
感谢您的每一条建议!
答案 0 :(得分:1)
您可以在调用sourcemap init函数之前尝试组合流吗?
我没有机会测试以下代码(许多需要省略)但你可以有一个想法:
var filter = require('gulp-filter');
var lessFilter = filter('**/*.less');
gulp.task('styles', function() {
return gulp.src([sources.css, sources.less])
.pipe(sourcemaps.init())
.pipe(lessFilter)
.pipe(less())
.pipe(filter.restore())
.pipe(minify({ keepSpecialComments: '*' }))
.pipe(concat('main.css'))
.pipe(sourcemaps.write())
.pipe(gulp.dest(destinations.css))
});