Webpack Web包开发服务器：监视任意目录文件并重新加载

当指定的任意文件集发生更改时，是否可以使webpack dev server重新加载

大致如下：

devServer: {
    watchTheseFiles: [ 'path/to/files', 'path/to/more/files' ]
}

更确切地说，我可以指定一个要监视哪些文件的正则表达式吗

当我在任意文件中触发某些更改时（它们可能是

.txt

，

.png

，等等），我这样做是为了重新加载

---

目前，

contentBase

中指定的路径似乎不会在文件更改时触发重新加载。

我不确定是否有比

contentBase

更好的可用路径

webpack

、

webpack dev server

和

webpack dev middleware

都公开了一个帮助程序，但它需要您创建自定义脚本以编程方式管理编译器、服务器或中间件来调用处理程序

类似于此，在所有配置为监视的编译器中都应该使用的方法是添加额外的文件作为编译依赖项，并让webpack处理失效。您也可以在以编程方式使用webpack时执行此操作，但编写自己的插件并从配置中执行此操作也非常容易。下面是一个例子：

class CustomContextPlugin {
    apply (compiler) {
        compiler.hooks.beforeCompile.tap('CustomContextPlugin', params => {
            params.compilationDependencies.add(
                path.resolve(__dirname, 'public', 'robots.txt')
            )
        })
    }
}

module.exports = {
    plugins: [
        new CustomContextPlugin()
    ]
}

它使用

beforeCompile

钩子添加一个

robots.txt

文件作为编译依赖项。在不执行任何缓存的开发中，这会导致开发服务器重新加载页面，因为会发出新的块

---

可能还有其他选择。我想到的一件事是可能有一个开发条目或其他使用的模块，但我认为这些选项需要更多的努力。

contentBase不起作用有点不寻常。在其他情况下观看是否有效，例如当您更改输入脚本时？在某些系统上，您可能需要轮询或增加inotify观察者的数量。