WSL 2下重新安装Windows 10后，Nodemon和webpack-dev-server的热重载不起作用

Question

几天前我重新安装了 Windows 10。我正在使用 Express 作为后端和 React.js 作为前端开发全栈 web 应用程序。我使用 nodemon 重新加载服务器，webpack-dev-server 重新加载前端。值得一提的是，我正在使用 WSL2。我注意到当保存文件时，nodemon 没有反应。我不得不手动输入 rs 来重新加载。起初以为这是 nodemon 的问题。在这里寻找类似的问题，但我找到的只是 --watch，这并没有帮助。由于我尝试了 webpack 并且问题仍然存在，我很无助。下面是一些有用信息： webpack 命令：webpack-dev-server --host 0.0.0.0 --config ./webpack.config.js --mode development。 webpack.config.js 文件内容：

module.exports = {
    entry: ["babel-polyfill", "./app/index.jsx"],
    module: {
        rules: [
            {
                test: /\.(js|jsx)$/,
                exclude: /node_modules/,
                use: ["babel-loader"],
            },
            { test: /\.css$/, use: ["style-loader", "css-loader"] },
            {
                test: /\.(jpg|png|svg)$/,
                loader: "file-loader",
                options: {
                    name: "[path][name].[hash].[ext]",
                },
            },
        ],
    },
    resolve: {
        alias: {
            components: __dirname + "/app/components",
            reducers: __dirname + "/app/reducers",
            constants: __dirname + "/app/constants",
            actions: __dirname + "/app/actions",
            store: __dirname + "/app/store",
            styles: __dirname + "/app/styles",
            assets: __dirname + "/app/assets/",
            api: __dirname + "/app/api/",
        },
        enforceExtension: false,
        extensions: [".js", ".jsx"],
    },
    output: {
        path: __dirname + "/public",
        publicPath: "/",
        filename: "index.js",
    },
    devServer: {
        contentBase: "./public",
        port: 8080,
    },
};

同时这两个在 Linux 笔记本上都能正常工作，在重新安装之前也一切正常。

- FreakyOne

---

尝试在全局状态下重新安装nodemon。npm install -g nodemon - phemieny7

@Phemieny007 刚试了一下，但是没成功。还是谢谢你的建议。 - FreakyOne

Answer 1

我自己解决了这个问题。在这里发布一下，以防有人遇到同样的问题。我的系统重新安装后与之前的不同之处在于升级为WSL2。由于某种原因，在WSL2中，nodemon和webpack-dev-server热重载无法工作。降级到WSL1可以解决问题。

编辑：为了使此方法在WSL 2中起作用，项目需要位于Linux文件系统内。（我很久以前就发现了这个问题，只是忘记在这里发布了。）

- FreakyOne

---

非常感谢您的跟进。这很有帮助。我不想把我的文件埋在难以访问的虚拟机中。再次，糟糕的操作系统手艺被一个“建议”修补了。希望我们不会完全失去这个功能。 - Mitch

对于我在WSL2（Ubuntu 18.04发行版）中设置的Rails应用程序，webpack-dev-server无法监视不在Ubuntu内部的文件修改。因此，我将其移动到Ubuntu的主目录中，现在它能够响应文件更改并编译它们。我在Windows上使用Sublime文本进行开发，因此要访问该项目，我使用路径“\wsl$\Ubuntu-18.04\home<user>\projects”在Sublime文本中打开。 - August

项目需要在Linux文件系统内部。 - EugZol

Answer 2

试一试：

module.exports = {
  //...
  watchOptions: {
    poll: 1000 // Check for changes every second
  }
};

观察模式和 WatchOptions

或将您的文件移动到 WSL 文件系统中：

\\wsl$\<distroname>\home\<username>

- HNV

---

将文件移动到WSL2文件系统中会增加1分。奇怪的是，尽管文件存在于WSL2文件系统之外，但我几天前在WSL2中自动重新加载了npm。话虽如此，微软建议不要跨文件系统工作。https://learn.microsoft.com/en-us/windows/wsl/compare-versions#performance-across-os-file-systems - user2533660

Answer 3

尝试这个方法，它对我有效：

webpack -w --watch-poll

- Gabor