用 gulp 观看所有文件？答案

【问题标题】：Watch all files with gulp?用 gulp 观看所有文件？
【发布时间】：2018-03-28 13:24:30
【问题描述】：

目前我有如下文件夹结构。

CSS
- scss
  - _icon.scss
  - _admin.scss
- main.scss
- personal.scss
模块
- 指令
  - 地图
    - map.html
    - map.scss
    - map.js

我对以下内容大吃一惊

gulp.task("sass", function() {
    return gulp.src('css/main.scss') // location of main scss file name
        .pipe(sourcemaps.init()) //TODO: important, comment out this line in staging and production
        //.pipe(rename({suffix: '.min'})) // include this to rename the file to fileName.min.css
        //.pipe(minifycss()) // include this to minify the file
        .pipe(sass.sync().on('error', sass.logError))
        .pipe(sourcemaps.write()) //TODO: important, comment out this line in staging and production
        .pipe(concat("main.min.css"))
        .pipe(gulp.dest('./css'));
});

当有任何更改时，我想查看我的根目录中所有扩展名为 .scss 的文件。

【问题讨论】：

标签： javascript gulp gulp-watch gulp-sass gulp-sourcemaps

【解决方案1】：

如果你的 'sass' 任务编译正确，那么你只需要一个监视任务来自动运行该任务。

gulp.task('watch', function() {
    gulp.watch(['./**/*.scss'], ['sass'])
});

通过将gulp 添加到“默认”任务中，使其在运行gulp 时自动运行....

gulp.task('default', ['sass', 'watch'])

https://gulpjs.com/

【讨论】：

有了这个 recompile 整个 glob 匹配每个文件更改。不需要。

【解决方案2】：

我制作了一个 gulp 插件以允许使用节点 sass 进行增量缓存。

试一试： https://github.com/hitmands/gulp-sass-pedigree

【讨论】：