我对gulp有问题:由于更新了它,因此在启动gulp watch时遇到一些错误。我认为我的gulpfile.js不再正确,但是我找不到问题。
有人可以帮助我创建功能正常的gulpfile吗?
这是我当前的文件
gulpfile.js:
/*---------- Sources ----------*/
// css
var css_src = ['css/style.scss'];
var jshint_src = ['scripts/app.js'];
var js_global_src = [
'scripts/vendor/jquery-3.1.1.min.js',
'scripts/vendor/svg4everybody.min.js',
'scripts/vendor/modernizr-custom.js'].concat(jshint_src);
/*---------- Destinations ----------*/
var css_dir_final = '';
var js_file_final = 'scripts.min.js';
var js_dir_final = 'scripts/';
/*---------- Monitoring ----------*/
var watch_css = 'css/**/*.scss';
var watch_js = ['scripts/**/*.js', '!scripts/scripts.min.js'];
var gulp = require( 'gulp' ),
plumber = require( 'gulp-plumber' ),
sass = require( 'gulp-sass' ),
postcss = require( 'gulp-postcss' ),
cssnano = require( 'cssnano' ),
autoprefixer = require( 'autoprefixer' ),
banner = require( 'gulp-banner' ),
combineMq = require( 'gulp-combine-mq' ),
jshint = require( 'gulp-jshint' ),
concat = require( 'gulp-concat' ),
uglify = require( 'gulp-uglify' ),
watch = require( 'gulp-watch' ),
purify = require( 'gulp-purifycss');
/*---------- Post CSS plugins ----------*/
var plugins = [ autoprefixer({ browsers: ['last 2 versions', 'iOS 7'] }), cssnano() ];
/*------ simplification du message d'erreur------*/
var display_error = function ( error ) {
console.log( error.message );
this.emit( 'end' );
};
gulp.task('css', function() {
gulp.src( css_src )
.pipe(plumber({ errorHandler: display_error }))
.pipe(sass({ precision: 3 }))
.pipe(combineMq())
.pipe(purify(['./public/app/**/*.js', './public/**/*.html']))
.pipe(postcss( plugins ))
.pipe(gulp.dest( css_dir_final ));
});
gulp.task('js', function() {
gulp.src( jshint_src )
.pipe(plumber({ errorHandler: display_error }))
.pipe(jshint())
.pipe(jshint.reporter( 'default' ));
gulp.src( js_global_src )
.pipe(plumber({ errorHandler: display_error }))
.pipe(concat( js_file_final ))
.pipe(uglify())
.pipe(gulp.dest( js_dir_final ));
});
gulp.task('watch', function(){
gulp.watch( watch_css, gulp.series('css'));
gulp.watch( watch_js, gulp.series('js'));
});
package.json:
{
"name": "gulp-test",
"version": "1.0.0",
"description": "",
"main": "gulpfile.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "Marion",
"license": "ISC",
"devDependencies": {
"gulp": "^4.0.0",
"gulp-autoprefixer": "^6.0.0",
"gulp-banner": "^0.1.3",
"gulp-combine-mq": "^0.4.0",
"gulp-concat": "^2.6.1",
"gulp-cssnano": "^2.1.3",
"gulp-jshint": "^2.1.0",
"gulp-plumber": "^1.2.1",
"gulp-postcss": "^8.0.0",
"gulp-purifycss": "^0.2.0",
"gulp-sass": "^4.0.2",
"gulp-uglify": "^3.0.1",
"gulp-watch": "^5.0.1",
"jshint": "^2.10.1",
"node-sass": "^4.11.0"
}
}
运行gulp时出现错误:
C:\xampp\htdocs\Projets\gulp-test (gulp-test@1.0.0)
λ gulp watch
[15:33:47] Using gulpfile C:\xampp\htdocs\Projets\gulp-test\gulpfile.js
[15:33:47] Starting 'watch'...
[15:33:58] Starting 'css'...
undefined:19:9: missing '}'
undefined:19:9: missing '}'
谢谢您的帮助,我非常感谢!