Gulpfile.js 文件不工作?
Gulpfile.js file is not working?
我的 Gulpfile.js 没有工作,甚至没有创建 css 文件夹,并且在我编辑“_globals.scss”时没有自动在其中添加文件。当我在此文件中创建更改时,此代码也没有任何更改,例如“_globals.scss”中的主体颜色更改也不起作用,并帮助我如何在 [=19= 中使用 cmd 调整 gulp 手表]
var gulp = require('gulp');
var livereload = require('gulp-livereload')
var uglify = require('gulp-uglifyjs');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
var imagemin = require('gulp-imagemin');
var pngquant = require('imagemin-pngquant');
gulp.task('imagemin', function () {
return gulp.src('./themes/custom/shinedelhi/images/*')
.pipe(imagemin({
progressive: true,
svgoPlugins: [{removeViewBox: false}],
use: [pngquant()]
}))
.pipe(gulp.dest('./themes/custom/shinedelhi/images'));
});
gulp.task('sass', function () {
gulp.src('./themes/custom/shinedelhi/sass/**/*.scss')
.pipe(sourcemaps.init())
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 7', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./themes/custom/shinedelhi/css'));
});
gulp.task('uglify', function() {
gulp.src('./themes/custom/shinedelhi/lib/*.js')
.pipe(uglify('main.js'))
.pipe(gulp.dest('./themes/custom/shinedelhi/js'))
});
gulp.task('watch', function(){
livereload.listen();
gulp.watch('./themes/custom/shinedelhi/sass/**/*.scss', ['sass']);
gulp.watch('./themes/custom/shinedelhi/lib/*.js', ['uglify']);
gulp.watch(['./themes/custom/shinedelhi/css/style.css', './themes/custom/shinedelhi/**/*.twig', './themes/custom/shinedelhi/js/*.js'], function (files){
livereload.changed(files)
});
});
您可以仅使用 gulp
从终端调用 Gulp,并在当前工作目录下搜索 gulpfile.js。这样做,它会搜索 default
任务并调用它。
你也可以传递参数给gulp,然后它会搜索与参数名称相同的任务,即在你的脚本中,如果你只是在终端执行gulp watch
,它应该执行(前提是您在正确的目录中执行它并且您的 gulp 文件已正确命名 gulpfile.js
)您的 watch
任务。
所以,我敢打赌 gulp watch
将为您设置 gulp 监视进程,然后来自终端的 gulp
命令应该设置 scss 和 uglify 监视程序。
也就是说,您需要它才能调用观察器。这并不意味着它将按预期工作。当您拥有 gulpfile.js
文件时,您必须确保文件夹中 .scss 和 .js 文件的路径是正确的 - 这是您必须在 cmd 终端中使用 gulp
命令的同一文件夹-.
(
如果您只想通过来自终端的 'gulp' 命令来使用 Gulp,您必须设置一个 'default' 任务来调用另一个任务。在你的情况下,它可能是这样的:
gulp.task('default' , ['watch']);
)
我的 Gulpfile.js 没有工作,甚至没有创建 css 文件夹,并且在我编辑“_globals.scss”时没有自动在其中添加文件。当我在此文件中创建更改时,此代码也没有任何更改,例如“_globals.scss”中的主体颜色更改也不起作用,并帮助我如何在 [=19= 中使用 cmd 调整 gulp 手表]
var gulp = require('gulp');
var livereload = require('gulp-livereload')
var uglify = require('gulp-uglifyjs');
var sass = require('gulp-sass');
var autoprefixer = require('gulp-autoprefixer');
var sourcemaps = require('gulp-sourcemaps');
var imagemin = require('gulp-imagemin');
var pngquant = require('imagemin-pngquant');
gulp.task('imagemin', function () {
return gulp.src('./themes/custom/shinedelhi/images/*')
.pipe(imagemin({
progressive: true,
svgoPlugins: [{removeViewBox: false}],
use: [pngquant()]
}))
.pipe(gulp.dest('./themes/custom/shinedelhi/images'));
});
gulp.task('sass', function () {
gulp.src('./themes/custom/shinedelhi/sass/**/*.scss')
.pipe(sourcemaps.init())
.pipe(sass({outputStyle: 'compressed'}).on('error', sass.logError))
.pipe(autoprefixer('last 2 version', 'safari 5', 'ie 7', 'ie 8', 'ie 9', 'opera 12.1', 'ios 6', 'android 4'))
.pipe(sourcemaps.write('./'))
.pipe(gulp.dest('./themes/custom/shinedelhi/css'));
});
gulp.task('uglify', function() {
gulp.src('./themes/custom/shinedelhi/lib/*.js')
.pipe(uglify('main.js'))
.pipe(gulp.dest('./themes/custom/shinedelhi/js'))
});
gulp.task('watch', function(){
livereload.listen();
gulp.watch('./themes/custom/shinedelhi/sass/**/*.scss', ['sass']);
gulp.watch('./themes/custom/shinedelhi/lib/*.js', ['uglify']);
gulp.watch(['./themes/custom/shinedelhi/css/style.css', './themes/custom/shinedelhi/**/*.twig', './themes/custom/shinedelhi/js/*.js'], function (files){
livereload.changed(files)
});
});
您可以仅使用 gulp
从终端调用 Gulp,并在当前工作目录下搜索 gulpfile.js。这样做,它会搜索 default
任务并调用它。
你也可以传递参数给gulp,然后它会搜索与参数名称相同的任务,即在你的脚本中,如果你只是在终端执行gulp watch
,它应该执行(前提是您在正确的目录中执行它并且您的 gulp 文件已正确命名 gulpfile.js
)您的 watch
任务。
所以,我敢打赌 gulp watch
将为您设置 gulp 监视进程,然后来自终端的 gulp
命令应该设置 scss 和 uglify 监视程序。
也就是说,您需要它才能调用观察器。这并不意味着它将按预期工作。当您拥有 gulpfile.js
文件时,您必须确保文件夹中 .scss 和 .js 文件的路径是正确的 - 这是您必须在 cmd 终端中使用 gulp
命令的同一文件夹-.
(
如果您只想通过来自终端的 'gulp' 命令来使用 Gulp,您必须设置一个 'default' 任务来调用另一个任务。在你的情况下,它可能是这样的:
gulp.task('default' , ['watch']);
)