文件监听是在发现源码发生变化时,自动重新构建出新的输出

文件 webpack 开启监听模式,有两种方式:

缺陷:每次需要手动刷新浏览器。

// package.json
{
  "name": "my-project",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack",
    "watch": "webpack --watch"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {}
}

原理:轮询判断文件的最后编辑时问是否变化。某个文件发生了变化,并不会立刻告诉监听者,而是先缓存起来,等 aggregatetimeout。

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