项目前端环境配置之-- gulp-watch

检测代码修改，自动刷新浏览器：

使用gulp内置的watch方法帮我们完成：gulpfile.js 文件

var gulp = require("gulp");
var cssnano = require("gulp-cssnano");
var rename = require("gulp-rename")
var watch = require("gulp-watch")

//压缩并且改名字 css
gulp.task("cssrename",async()=>{
   await gulp.src("./static/css/*.css") //找到css 源文件
   .pipe(cssnano())  //调用插件压缩 
   .pipe(rename({'suffix':'.min'}))
   .pipe(gulp.dest("./dist/css/")) //压缩后的文件放到指定的目录 
   //获取结果
});

//监控文件修改 
gulp.task("watch",function(){
   watch("./static/css/*.css",gulp.series('cssrename'));
})  //gulp.watch 4.0版本以后第二个参数必须是方法

其中package.json文件的version内容

{
 "name": "test2_node",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
   "test": "echo \"Error: no test specified\" && exit 1"
 },
 "author": "",
 "license": "ISC",
 "devDependencies": {
   "browser-sync": "^2.26.7",
   "gulp": "^4.0.2",
   "gulp-cache": "^1.1.3",
   "gulp-concat": "^2.6.1",
   "gulp-cssnano": "^2.1.3",
   "gulp-imagemin": "^7.1.0",
   "gulp-rename": "^2.0.0",
   "gulp-sass": "^4.0.2",
   "gulp-uglify": "^3.0.2",
   "gulp-watch": "^5.0.1"
 }
}

cmd 启动 gulp watch

正常情况下 修改文件后 会 Starting 接Finished
不过我这里出现问题 修改文件 没有反应，
我也查了一下午资料，全是gulp watch 响应一次的错误 没找到我这个
如果有朋友知道的也可以告诉我一下
我这边也会自己查 有结果反馈上来

2020/3/3 问题解决反馈

上面说了 我用gulp-watch 模块 加 watch 后 运行结果不刷新 我所修改的css文件

今天我试了 gulp.watch("./static/css/*.css",gulp.series(‘cssrename’));
发现这个问题就不存在，但我朋友们用watch也能正常使用
所以我认为电脑环境问题可能有部分影响，所以各位在尝试的时候如果：

gulp.task("watch",function(){
    watch("./static/css/*.css",gulp.series('cssrename'));
}) 

出现跟我一样情况的话可以使用：

gulp.task("watch",function(){
    gulp.watch("./static/css/*.css",gulp.series('cssrename'));
}) 

去解决！