我正在尝试将 gulpfile 任务拆分为不同的文件。我之前做过并将其添加到主 gulpfile 中,只需添加require('./path/taskName')
但这在 gulp 4 中不起作用
这是我的styles.js
file:
var gulp = require('gulp'),
postcss = require('gulp-postcss'),
autoprefixer = require('autoprefixer'),
cssvars = require('postcss-simple-vars'),
nestingCss = require('postcss-nested'),
cssImport = require('postcss-import');
function styles(){
console.log('Changes happened in CSS file');
return gulp.src('./public/styles/style.css')
.pipe(postcss([cssImport, cssvars, nestingCss, autoprefixer]))
.pipe(gulp.dest('./public/temp/styles'));
}
exports.styles = styles;
这是我的watch.js
file
var gulp = require('gulp'),
browserSync = require('browser-sync').create();
function html(done){
console.log('Changes happened in html');
browserSync.reload();
done();
}
function cssInject(){
return gulp.src('./public/temp/styles/style.css')
.pipe(browserSync.stream());
}
function watch(done){
browserSync.init({
server: {
baseDir: "public"
}
});
gulp.watch('./public/**/*.html', html);
gulp.watch('./public/styles/**/*.css', gulp.series(styles,cssInject));
done();
}
exports.html = html;
exports.watch = watch;
我将其添加到主 gulpfile 中
require('./gulp/tasks/styles.js');
require('./gulp/tasks/watch.js');
但这不起作用。它显示错误
$ gulp watch
[20:27:30] Using gulpfile ~\Desktop\gulp-website\gulpfile.js
[20:27:30] Task never defined: watch
[20:27:30] To list available tasks, try running: gulp --tasks