背景，我司m/www项目是套php-twig模板的写法，以HTML为入口。是gulp+webpack的打包方式，支持less/babel/polyfill/nodemon/browserSync/本地mock-server(express)等等，但是从最初几个业务模块到现在50+的业务模板，本地开发打包起来慢的要死。。。每次dev开发 50+监听 要20s才能编译成功，优化后再次回到毫秒级的开发体验

合理使用gulp/webpack缓存插件

下面几个插件，按需索取哈，反正我是都有了。
有多文件用的，有对dev-watch时用的，都有效果。

gulp-cache 缓存文件

https://www.npmjs.com/package/gulp-cache

gulp-cache & gulp-remember 内存缓存好兄弟

https://www.npmjs.com/package/gulp-cached
https://www.npmjs.com/package/gulp-remember

happypack Webpack 4 以下版本强烈需要

https://www.npmjs.com/package/happypack

优化编译代码

gulp.watch增加interval配置，减少100ms轮询，降低cpu消耗

const watchOption = { interval: 750 }
gulp.watch('监听文件',watchOption,'task名')

配置本地.localBuildConfig.js文件，dev模式下替换掉常用的通配符，减少监听及打包文件

先上图

大部分gulp的编译监听都是这样写

等views下面业务模块有50+，widget目录下面有20个左右。。。那编译一次真的是呵呵呵
所以我们增加了一个.localBuildConfig.js

image.png

让同学们只编译/监听自己想要的文件即可，同时在编译log中给予提示

没有配置 .localBuildConfig.js 文件

配置了 .localBuildConfig.js 文件