webpack --watch不编译更改的文件

问题是：webpack从一些奇怪的URL加载脚本：webpack：///缓存了。您应该在脚本末尾添加版本以防止缓存： main-compiled.js?v=<?php echo time()?>"

尝试更改--watch为-d --watch

为我工作

当我遇到类似的问题时，我遇到了这个问题-似乎webpack没有重新打包，即使运行webpack --config。

我什至删除了bundle.js，网页仍然像编辑前一样显示。

对于那些遇到同样问题的人，我终于在chrome中进行了“空缓存和硬重载”选项（在打开devtools的情况下右键单击重载按钮），就可以做到这一点

如果您的项目突然发生这种情况，则可以解决此问题。

也许以某种方式跟踪您的项目的文件更改了webpack所查找的文件，但已损坏。您可以按照以下简单步骤再次创建它们。

1. 从您的项目目录中出来。（$：cd ..）
2. 将您的项目移动到其他目录（$：mv {projectName} {newName}）
3. 进入新目录（$：cd {newName}）
4. 启动服务器并检查是否在每次文件更改时都重新加载（在大多数情况下它应该可以工作，因为现在webpack会创建新文件来监视更改）
5. 从目录出来（$：cd ..）
6. 将其移回其原始名称（$：mv {newName} {projectNam}）这对我​​有用.........

我遇到了同样的问题，尝试了很多事情，最后Mac上的Chrome清除浏览数据对我有用。

这些模块已安装：

“ browser-sync”：“ ^ 2.26.7”，

“ browser-sync-webpack-plugin”：“ ^ 2.2.2”，

“ webpack”：“ ^ 4.41.2”，

“ webpack-cli”：“ ^ 3.3.9”

在尝试了一些解决该问题的策略后，我最终只是放弃了，但是在解决另一个问题时，我又尝试了一下，突然间，--watch旗帜终于奏效了。

老实说，我不知道是什么让它特别起作用，但是在执行了以下步骤之后，它才开始起作用：

1. Install most recent gcc version
$ sudo port install gcc48
$ sudo port select --set gcc mp-gcc48

2. Install most recent clang version
$ sudo port install clang-3.6
$ sudo port select --set clang mp-clang-3.6

3. Export variables holding the patch to C and C++ compiler
$ export CC=/opt/local/bin/clang
$ export CXX=/opt/local/bin/clang++

可能已经发生了，在安装这些软件包时，某些依赖性只是增加了难题的缺失部分，谁知道...

希望这可以帮助任何苦苦挣扎的人使它正常工作。

我要添加另一个答案，因为我认为这是迄今为止最好的解决方案。我每天都在使用它，它震撼了！只需安装此库：

https://github.com/gajus/write-file-webpack-plugin

说明：强制webpack-dev-server程序将捆绑文件写入文件系统。

如何安装 ：

npm install write-file-webpack-plugin --save-dev

在MacOS上，一个简单的解决方案如下：

在项目所在的同一目录中打开两个终端窗口。

在第一个终端窗口中运行：webpack --watch

在第二个终端窗口中运行：webpack-dev-server

我尝试了许多可能的解决方案，这似乎是最可靠的

我遇到了类似的问题，无论是Webpack还是手表模式下的汇总都无法捕捉到我所做的更改。我发现这基本上是我的错，因为我正在更改尚未导入应用程序中任何位置的模块（.tsx文件）（例如，作为入口点的App.ts），并且我期望构建工具来报告错误，在那里。

在使用Vagrant（2.1.15）和rsync同步的VirtualBox（5.2.18）Ubuntu（18.04）VM中也存在此问题。突然，第一个构建运行良好，但Webpack甚至在fs.inotify.max_user_watches=524288设置好之后都没有考虑到更改。添加poll: trueWebpack配置也没有帮助。

只能vagrant-notify-forwarder工作（出于某种原因，vagrant-fsnotify无效），但是在将文件保存到主机后，重建发生得太快了，我想rsync没有足够的时间来完成其任务（可能是由于数量我的Vagrantfile中同步目录的内容？）。

最后，通过增加aggregateTimeoutWebpack配置，使手表再次工作：

module.exports = {
  watch: true,
  watchOptions: {
    aggregateTimeout: 10000
  },
  ...
}

如果此解决方案适合您，请尝试再次降低此值，否则您将需要等待10秒钟，直到每次您点击保存都会重新开始构建。默认值为300毫秒。

我有同样的问题。而且我注意到它没有编译，因为我的文件夹包含一些字符（*）。使用旧的watcher插件似乎可以解决此问题。将此行添加到您的webpack配置文件中。

plugins: [
    new webpack.OldWatchingPlugin()
  ]

对我来说，在VS Code中创建文件夹和文件是个问题。为了解决这个问题，我重新克隆了仓库，这次，通过命令行而不是通过代码创建了新的文件夹和文件。我认为代码由于某种原因破坏了文件。我看到该应用程序刚刚更新，因此可能是一个新错误。

对我来说，删除node_modules并再次执行npm install或yarn来安装所有软件包可以解决问题

解决问题的方法是在导入路径中发现一个大写错误。文件系统上的文件夹首字母为小写，导入路径为大写。一切都编译良好，所以这只是一个webpack监视包含问题。

如果您使用的是Vim，则应尝试将backupcopy设置为yes，而不是默认的auto。否则，Vim有时会重命名原始文件并创建一个新文件，这将使webpack watch混乱：

https://github.com/webpack/webpack/issues/781

如果是这种情况，只需将其添加到您的vim设置中即可：

设置backupcopy = yes

它不是为我重新编译的，但后来我意识到/记得webpack监视依赖关系图，而不仅仅是监视一个文件夹（或文件）。当然，我要更改的文件还不属于该图表。

更新：删除整个目录并从仓库中重新克隆git解决了我的问题。

请注意，如果您在虚拟机（Vagrant / Virtualbox）中运行webpack并在主机平台上更改文件，则共享文件夹中的文件更新可能不会在Ubuntu上触发inotify。这将导致更改不会被webpack接收。

请参阅：Virtualbox门票＃10660

就我而言，在de guest（在vi中）上编辑和保存文件确实触发了webpack。在主机上（在PhpStorm，记事本或任何其他应用程序中）进行编辑，无论如何都不会触发webpack。

我通过使用vagrant-fsnotify解决了它。

我在.vue文件上遇到相同的问题。重新启动服务器后，一切正常，但在下一次保存时，不再重新编译。问题出在一个大写字母的导入文件路径上。很难弄清楚这个问题，因为服务器重启后一切正常。检查路径的大小写。

文件夹区分大小写是我的问题。我对require（）的代码调用具有所有小写的路径名，但是实际目录中有一个大写字母。我将所有目录重命名为小写，并且可以立即观看Webpack。

在Laravel Homestead为我工作

--watch --watch-poll

如果按César的指示更改fs.inotify.max_user_watches仍然不起作用，请尝试通过按文档所示创建脚本或使用带--watch --watch-poll选项的webpack运行轮询而不是本机监视程序。

如果您的代码没有被重新编译，请尝试增加观察者的数量（在Ubuntu中）：

echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p

来源：https : //webpack.github.io/docs/troubleshooting.html

使用WebStorm时遇到了这个问题。

禁用设置->系统设置->“安全写入”已为我解决。

在以下位置找到了这样做的建议：WebPack故障排除

只是为了增加可能的解决方案：我将项目文件夹放在Dropbox文件夹中，将其移出为我解决了问题。（OS X）

一个问题是，如果您的路径名不是绝对的，则将发生这种情况。我不小心设置resolve.root为./而不是，__dirname这导致我浪费大量时间删除和重新创建像我上面的家伙一样的文件。

将以下代码添加到我的webpack配置文件中可以解决此问题，希望对您有所帮助。不要忘记忽略您的node_modules文件夹，因为那样会降低HMR（热模块更换）的性能：

watchOptions: {
  poll: true,
  ignored: /node_modules/
}