我有点搞不懂为什么我的gulp任务在文件更改时不运行。在控制台中,它检测到了更改,但实际上并没有重新运行任务。对于gulp来说,这是一个新手,所以希望能得到一些帮助。
const gulp = require('gulp');
const sass = require('gulp-sass')(require('sass'));
const autoprefixer = require('gulp-autoprefixer');
const browserSync = require('browser-sync').create();
const cleanCSS = require('gulp-clean-css');
const concat = require('gulp-concat');
const babel = require('gulp-babel');
const uglify = require('gulp-uglify');
// Compile Sass files and add vendor prefixes
function style() {
return gulp
.src('public/assets/css/*.css') // Source files
.pipe(sass().on('error', sass.logError)) // Compile Sass to CSS
.pipe(autoprefixer()) // Add vendor prefixes
.pipe(cleanCSS()) // Minify CSS
.pipe(concat('styles.css'))
.pipe(gulp.dest('public/source/css')) // Output to destination folder
.pipe(browserSync.stream()); // Inject changes into the browser
}
function scripts() {
return gulp
.src('public/assets/js/*.js')
.pipe(babel({
presets: ['@babel/env']
}))
.pipe(uglify()) // Minify JavaScript
.pipe(concat('scripts.min.js'))
.pipe(gulp.dest('public/source/js'))
.pipe(browserSync.stream());
}
// Watch for changes in source files
function watch() {
browserSync.init({
proxy: "gif-ddev.ddev.site", // Your DDEV site URL
files: ["public/assets/css/*.css", "public/assets/js/*.js"],
open: true,
});
gulp.watch('public/assets/css/*.css', style); // Watch CSS files
gulp.watch('public/assets/js/*.js', scripts); // Watch JS files
gulp.watch(['templates/*.html', 'templates/**/*.twig']).on('change', browserSync.reload); // Watch HTML and Twig files
}
exports.style = style; // Expose the style task
exports.scripts = scripts;
exports.watch = watch; // Expose the watch task
1条答案
按热度按时间bnlyeluc1#
是关于树枝和模板的错误行。这样的痛苦。删除这个修复了这个问题。