Webpack：--hot或HotModuleReplacementPlugin无法正常运行

如何解决Webpack：--hot或HotModuleReplacementPlugin无法正常运行

我正在开发一个同构React应用程序，我想通过Webpack设置HMR工具。 我尝试过wbpack-dev-server --hot或HotModuleReplacementPlugin，但是它们都不起作用...

这是webpack.config.js和package.json。

const path = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
var fs = require('fs');
let webpack = require('webpack');

var nodeModules = {};
fs.readdirsync('node_modules')
  .filter(function(x) {
    return ['.bin'].indexOf(x) === -1;
  })
  .forEach(function(mod) {
    nodeModules[mod] = 'commonjs ' + mod;
  });

var config = { // la configuration commune pour les 2 modes.
  devtool: 'inline-source-map',context: path.resolve(__dirname,'app'),entry: {
    '/bundle-app': ['babel-polyfill','./clientside/indexClient.js'],'/components/bundle-components': ['babel-polyfill','./components/App.js','./components/Form.js','./components/objetform/Home.js','./components/objetform/SetDB.js'],'/server/bundle-server': ['babel-polyfill','./serverside/server/createserver/app.js','./serverside/server/createserver/indexServer.js','./serverside/server/renderpage/renderFullPage.js','./serverside/server/renderpage/routerPage.js','./serverside/server/request/routerDB.js','./serverside/server/request/routerSetDB.js','./serverside/server/routes/routes.js',],'/services/bundle-services': ['./serverside/services/getMongooseData.js','./serverside/services/setMongooseData.js','./serverside/services/models/Employe.js'],'/assets/stylesheets/style': './assets/stylesheets/style.css',},target:'node',output: 
  {
    path: path.resolve(__dirname,'build'),// path.resolve(__dirname,// on crée l'application de sortie dans un dossier "public"
    filename: '[name].js',// les fichier bundle seront dans le chemin qui est le nom des fichiers d'entrées
  },module: 
  {
    rules: [
      {
        test: /\.(js|jsx)$/,// pour les fichiers de type js et jsx
        loader: 'babel-loader',// on charge babel un transcompileur 
        exclude: /node_modules/,options: 
        {
          presets: ['@babel/preset-env','@babel/preset-react']
        }
      },{
        test:/\.css$/,use:[
            {
              loader: MiniCssExtractPlugin.loader,options:
              {
                publicPath: '../../../build'
              },{loader: 'css-loader'},]
      }
    ]
  },plugins: [
    //new CleanWebpackPlugin(),new MiniCssExtractPlugin({
      filename: '[name].css',chunkFilename: '[id].css'
    }),new webpack.HotModuleReplacementPlugin(),};

module.exports = (env,argv) =>
{
  if (argv.mode === 'development') // la configuration en plus en mode dévelopement
  {
    devtool = 'eval'

    config.devServer = { // mise en place pour le serveur test
      contentBase: path.resolve(__dirname,inline: true,hot: true,}

  }

  if (argv.mode === 'production') // la configuration en plus en mode production
  {
    devtool = 'source-map'
  }
    return config;
}

{
  "name": "ssr-react-router-mongoose-isomorphic-app","version": "1.0.0","description": "isomorpic app","private": true,"scripts": {
    "build:server": "babel ./app/server -d build/server","build:watch:server": "babel ./app/server -d build/server --watch","build:client": "webpack --mode development --config webpack.config.js/  --progress ","build:watch:client": "webpack-dev-server --config ./webpack.config.js --hot","build:prod": "npm run build:server && npm run build:client","start": "npm run build:prod && NODE_ENV=production node ./build/server/bundle-server.js","start:dev": "parallelshell \"npm run build:watch:client\" \"nodemon ./build/server/bundle-server.js\" ","start:dev:client": "webpack-dev-server"
  },"author": "Rando Mathias","license": "ISC","dependencies": {
    "babel-polyfill": "^6.26.0","cors": "^2.8.5","express": "^4.17.1","mongoose": "^5.10.6","react": "^16.4.0","react-dom": "^16.4.0","react-router-dom": "^5.2.0"
  },"devDependencies": {
    "@babel/cli": "^7.11.6","@babel/core": "^7.11.6","@babel/preset-env": "^7.11.5","@babel/preset-react": "^7.10.4","babel-loader": "^8.1.0","clean-webpack-plugin": "^3.0.0","css-loader": "^5.0.0","file-loader": "^6.1.0","mini-css-extract-plugin": "^1.2.1","nodemon": "^2.0.4","parallelshell": "^3.0.2","resolve-url-loader": "^3.1.2","style-loader": "^2.0.0","webpack": "^4.44.2","webpack-cli": "^3.3.12","webpack-dev-server": "^3.11.0"
  }
}

有关信息，在热重载之前，我使用了 npm 命令： npm run build：client 然后 npm run start：dev 。 另外，当我保存我的代码时，powershell确实会响应，但不会编译新代码或刷新浏览器。它确实在powershell中打印了以下内容：

！wdm｣：哈希：09c22a67c879a7645c8e版本：webpack 4.44.2时间： 1716ms建立在：2020-11-03 9:28:33 资产规模块
块名 /assets/stylesheets/style.911d579609fd270f8926.hot-update.js 1.86 KiB / assets / stylesheets / style，/ assets / stylesheets / style [emitted] [immutable] [hmr] / assets / stylesheets / style， /资产/样式表/样式 /assets/stylesheets/style.css 3.18 KiB / assets / stylesheets / style [emited] / assets / stylesheets / style /assets/stylesheets/style.js 102 KiB / assets / stylesheets / style [散发] / assets / stylesheets / style /bundle-app.911d579609fd270f8926.hot-update.js 11.9 KiB / bundle-app，/ bundle-app [已发出] [不可变] [hmr] / bundle-app，/ bundle-app /bundle-app.js 3.02 MiB / bundle-app [已发布] / bundle-app /components/bundle-components.911d579609fd270f8926.hot-update.js
11.9 KiB / components / bundle-components，/ components / bundle-components [发射] [不可变] [hmr] / components / bundle-components， / components / bundle-components /components/bundle-components.js 3.02 MiB / components / bundle-components [已发布] / components / bundle-components /server/bundle-server.911d579609fd270f8926.hot-update.js 11.9 KiB / server / bundle-server，/ server / bundle-server [发射] [不可变] [hmr] / server / bundle-server， /服务器/捆绑服务器 /server/bundle-server.js 13.3 MiB / server / bundle-server [已发出] / server / bundle-server /services/bundle-services.js 8.37 MiB / services / bundle-services [已发布] / services / bundle-services 911d579609fd270f8926.hot-update.json 152个字节
[发射] [不可变] [hmr]入口点/ bundle-app = /bundle-app.js /bundle-app.911d579609fd270f8926.hot-update.js /bundle-app.911d579609fd270f8926.hot-update.js入口点 / components / bundle-components = /components/bundle-components.js /components/bundle-components.911d579609fd270f8926.hot-update.js /components/bundle-components.911d579609fd270f8926.hot-update.js 入口点/ server / bundle-server = /server/bundle-server.js /server/bundle-server.911d579609fd270f8926.hot-update.js /server/bundle-server.911d579609fd270f8926.hot-update.js入口点 / services / bundle-services = /services/bundle-services.js入口点 / assets / stylesheets / style = /assets/stylesheets/style.css /assets/stylesheets/style.js /assets/stylesheets/style.911d579609fd270f8926.hot-update.js /assets/stylesheets/style.911d579609fd270f8926.hot-update.js [./components/objetform/Home.js] 6.33 KiB {/ bundle-app} {/ components / bundle-components} {/ server / bundle-server} [内置] + 971个隐藏模块

我使用的是 Visual Studio代码。

谢谢。