文件监听原理

[TieMuZhen]

在发现源码发生变化时，自动重新构建出新的输出文件。

Webpack开启监听模式，有两种方式：

• 启动webpack命令时，带上--watch参数
• 在配置webpack.config.js中设置watch: true

原理： 轮询判断文件的最后编辑时间是否变化，如果某个文件发生了变化，并不会立刻告诉监听者，而是先缓存起来，等时间到 aggregateTimeout后再执行。

module.export = {    
  // 默认false,也就是不开启    
  watch: true,    
  // 只有开启监听模式时，watchOptions才有意义    
  watchOptions: {        
    // 默认为空，不监听的文件或者文件夹，支持正则匹配        
    ignored: /node_modules/,       
    // 监听到变化发生后会等300ms再去执行，默认300ms       
    aggregateTimeout: 300,        
    // 判断文件是否发生变化是通过不停询问系统指定文件有没有变化实现的，默认每秒问1000次        
    poll:1000    
  }
}

缺点： 每次需要手动刷新浏览器

Webpack的热更新又称热替换（Hot Module Replacement），缩写为HMR。 这个机制可以做到不用刷新浏览器而将新变更的模块替换掉旧的模块。

所以实际中可以多用热更新少用文件监听