我在wp-content目录中有一个WordPress主题,名称是wonaco。在这个文件夹中,我有这个gulpfile.js文件:
var gulp = require('gulp');
var sass = require('gulp-sass');
var browserSync = require('browser-sync').create();
var concat = require('gulp-concat');
var cssnano = require('gulp-cssnano');
var uglify = require('gulp-uglify');
var pipeline = require('readable-stream').pipeline;
gulp.task('sass', function() {
return gulp.src('wanoca/scss/**/*.scss')
.pipe(sass())
.pipe(cssnano())
// concat will combine all files declared in your "src"
.pipe(concat('main.css'))
.pipe(gulp.dest('wanoca/assets/css'))
.pipe(browserSync.reload({
stream: true
}))
});
gulp.task('browserSync', function(done) {
browserSync.init({
server: {
baseDir: 'wanoca'
},
});
done();
})
gulp.task('compress', function() {
return pipeline(
gulp.src('wanoca/js/*.js'),
uglify(),
gulp.dest('wanoca/assets/js')
);
});
gulp.task('watch', gulp.series('browserSync', 'sass', 'compress', function() {
gulp.watch('wanoca/scss/**/*.scss', gulp.series('sass'));
gulp.watch('wanoca/js/*.js', gulp.series('compress'));
gulp.watch("wanoca/**/*.html", { events: 'all' }, function(cb) {
browserSync.reload();
cb();
});
gulp.watch('wanoca/js/**/*.js', browserSync.reload);
}));
我的主题文件夹结构如下:
assets
inc
js
languages
node_modules
page_templates
scss
template-parts
.gitignore
all WordPress files...
我正在尝试将scss和js文件夹代码编译为assets/css和assets/js
但是使用我当前的gulpfile.js文件代码它不能监视任何scss更改,不能用正确的URL将更改加载到浏览器。
- 正确的URL是http://localhost/wanoca-wp/*
你们能告诉我怎么修吗?
1条答案
按热度按时间i7uq4tfw1#
你的节点,包和gulp文件必须在主wp应用程序文件夹之外,即。