webpack4 热重载不适用于某些文件

Question

当我尝试热重载某些文件的更改时，React webpack4 出现问题。以及那些我从其原始路径修改的文件（/from /src/containers to /src/components）其余文件重新加载工作正常...... 我的 webpack 配置文件的代码如下：

  const path = require('path');
  const HtmlWebPackPlugin = require("html-webpack-plugin");
  const Dotenv = require('dotenv-webpack');

  const htmlWebpackPlugin = new HtmlWebPackPlugin({
    template: "./src/index.html",
    filename: "./index.html"
  });

  module.exports = {
    output: {
      path: path.join(__dirname, './'),
      publicPath: '/'
    },
    module: {
      rules: [
        {
          test: /\.js$/,
          exclude: /node_modules/,
          use: {
            loader: "babel-loader"
          }
        },
        {
          test: /\.html$/,
          use: [
            {
              loader: "html-loader",
              options: { minimize: true }
            }
          ]
        },
        {
          test: /\.css$/,
          use: [
            {
              loader: "style-loader"
            },
            {
              loader: "css-loader",
              options: {
                modules: true,
                importLoaders: 1,
                localIdentName: "[name]_[local]_[hash:base64]",
                sourceMap: true,
                minimize: true
              }
            }
          ]
        }
      ]
    },
    plugins: [
      new HtmlWebPackPlugin({
        template: "./src/index.html",
        filename: "./index.html"
      }),
      new Dotenv()
    ],
    devServer: {
      historyApiFallback: true,
    }
  };

Answer 1

如果你能分享错误日志，我可能会告诉你真正的问题是什么。但是缺少入口点的当前配置。如果您的应用程序是单页应用程序，请按照以下代码进行操作；

module.exports = {
  entry: path.join(__dirname, "src", "index.js"),
  ...
}

如果您正在构建多页应用程序，请按照以下代码进行操作；

module.exports = {
  entry: {
    pageOne: path.join(__dirname, "src", "pageOne", "index.js"),
    pageTwo: path.join(__dirname, "src", "pageTwo", "index.js"),
    pageThree: path.join(__dirname, "src", "pageThree", "index.js")
  }
  ...
}

Answer 2

对于到达这里并遇到此问题的任何人，我遇到了这个确切的问题，我的 'src/components' 目录中的文件没有热重新加载。

当我在日志中看到 webpack 出于某种原因正在寻找目录 'src/Components' 时，我能够修复它，所以我将组件目录的名称更改为完全不同的名称，例如 [=16] =] 然后将其改回 'components' 和运行全新安装。

webpack4 热重载不适用于某些文件

webpack4 hot reloading not working for some files

reactjs

webpack

webpack-dev-server

html-webpack-plugin

webpack-4