javascript - Gulp watch 什么都不做

Question

我正在尝试使用 Watch 来编译我的 SASS 文件，但它不起作用。

包.json

"author": "José Ramón Rico Lara",
  "license": "ISC",
  "devDependencies": {
    "gulp": "^4.0.2",
    "gulp-concat": "^2.6.1",
    "gulp-imagemin": "^7.1.0",
    "gulp-notify": "^3.2.0",
    "gulp-sass": "^4.1.0",
    "gulp-webp": "^4.0.1"
  }
}

Gulpfile.js

const { series, src, watch, dest, parallel } = require('gulp');
const sass = require('gulp-sass')
const webp = require('gulp-webp');

const paths = {
    scss: 'src/scss/**/*.scss',
    js: 'src/js/**/*.js'
}

function css() {
    return src(paths.scss)
        .pipe(sass())
        .pipe(dest('./build/css'))
}

function javascript() {
    return src(paths.js)
        .pipe(concat('bundle.js'))
        .pipe(dest('./build/js'))
}

function watchArchivos() {
    watch(paths.scss, css); // * = La carpeta actual - ** = Todos los archivos con esa extensión
    watch(paths.js, javascript);
}

exports.css = css;
exports.javascript = javascript;
exports.watchArchivos = watchArchivos;

exports.default = series(css, javascript, watchArchivos);

在控制台中它说代码正在运行并且没有任何问题，但是当我更改任何文件时它不会编译它。

标签： javascriptcssgulp

Answer 1

有一个类似的问题，观看任务从未执行，在这种情况下（浏览器）的第一个任务是浏览器同步实例，在我的情况下浏览器任务是异步的，所以我不得不使用 asyn / await 并且一切正常。从：

function browser() {
  browserSync.init({
    server: {
      baseDir: PATHS.output,
    },
  });
}
exports.default = series (browser, watching);

至

async function browser() {
  await browserSync.init({
    server: {
      baseDir: PATHS.output,
    },
  });
}