启动时,我遇到了问题。我得到的信息来自https://coder-coder.com/gulp-4-walk-through/和https://www.youtube.com/watch?v=-lG0kDeuSJk。
我的gulpfile.js
// Initialize modules
const { src, dest, watch, series, parallel } = require('gulp');
const autoprefixer = require('autoprefixer');
const cssnano = require('cssnano');
const concat = require('gulp-concat');
const postcss = require('gulp-postcss');
const replace = require('gulp-replace');
const sass = require('gulp-sass');
const sourcemaps = require('gulp-sourcemaps');
const terser = require('gulp-terser');
// File path variables
const files = {
scssPath: './assets/styles/sass/**/*.scss',
jsPath: './assets/js/**/*.js'
}
// Sass taks
function scssTask(){
return src(files.scssPath)
.pipe(sourcemaps.init())
.pipe(sass())
.pipe(postcss([ autoprefixer(), cssnano() ]))
.pipe(sourcemaps.write('.'))
.pipe(dest('dist'));
}
// JS taks
function jsTask(){
return src(files.jsPath)
.pipe(concat('main.js'))
.pipe(terser())
.pipe(dest('dist'));
}
// Cachebusting taks
const cbString = new Date().getTime();
function cacheBustTask(){
return src(['index.html'])
.pipe(replace(/cb=\d+/g, 'cb=' + cbString))
.pipe(dest('.'));
}
// Watch taks
function watchTask(){
watch([files.scssPath, files.jsFiles],
series(
parallel(scssTask, jsTask),
cacheBustTask
)
);
}
// Default task
exports.default = series(
parallel(scssTask, jsTask),
cacheBustTask,
watchTask
);
当我在文件夹中启动命令gulp时,出现错误提示:
[[09:53:25]'watchTask'在1.81毫秒后发生错误]
[[09:53:25] TypeError:预期为字符串
at module.exports (D:\Web-Development\Startup\practise\sassStructure-Copy\node_modules\is-negated-glob\index.js:5:11)
at sortGlobs (D:\Web-Development\Startup\practise\sassStructure-Copy\node_modules\glob-watcher\index.js:66:18)
at Array.forEach (<anonymous>)
at watch (D:\Web-Development\Startup\practise\sassStructure-Copy\node_modules\glob-watcher\index.js:63:18)
at Gulp.watch (D:\Web-Development\Startup\practise\sassStructure-Copy\node_modules\gulp\index.js:48:10)
at watchTask (D:\Web-Development\Startup\practise\sassStructure-Copy\gulpfile.js:46:3)
at bound (domain.js:420:14)
at runBound (domain.js:433:12)
at asyncRunner (D:\Web-Development\Startup\practise\sassStructure-Copy\node_modules\async-done\index.js:55:18)
at processTicksAndRejections (internal/process/task_queues.js:75:11)
[[09:53:25]'默认'在721毫秒后发生错误
我该如何解决?它期望字符串,我给它一个字符串喷射,它不起作用。我已经把
function watchTask(){
watch([files.scssPath, files.jsFiles],
series(
parallel(scssTask, jsTask),
cacheBustTask
)
);
}
然后我没有收到任何错误,watchTask启动,但是没有文件得到更新,只是保持沉默哈哈
有人可以向我解释为什么它不像每个人的项目一样知道它的字符串,而我必须使用toString()将其转换为字符串,以及为什么watch函数watchTask无法识别任何更新?提前谢谢。
似乎您使用了错误的变量名。应该使用jsPath
。无论哪种方式,请尝试使其更具可读性...例如,您可以使用:
const watch = function() {
gulp.watch("./assets/styles/sass/**/*.scss", {usePolling : true}, gulp.series(css));
gulp.watch("./assets/js/**/*.js", {usePolling : true}, gulp.series(js));
};
如果您使用此代码,则手表不必在代码的第一行要求插入口水。
最后使代码块如下:
// Default task
exports.default = series(
parallel(scssTask, jsTask),
cacheBustTask,
watch
);
exports.watch =观看;