HMRを有効にしたときに自動リロードを行う方法

Question

私はwebpackを設定するために何度も試してきました。私はプロセスを開始するたびに自動再読み込みを有効にしてから、Web-dev-serverを有効にしてからhtmlへの変更は何の影響もなく、エラーも、何もない、変更、およびブラウザコンソールのログを更新する必要はありません。パッケージに

const path = require('path'); 
const HtmlWebpackPlugin = require('html-webpack-plugin'); 
const HtmlWebpackHarddiskPlugin = require('html-webpack-harddisk-plugin'); 
const webpack = require('webpack'); 

module.exports = { 
    entry: './src/js/index.js', 
    output: { 
     filename: 'app.js', 
     path: path.resolve(__dirname, 'dist'), 
    }, 
    plugins: [ 
     new HtmlWebpackPlugin({ 
      title: 'Hello world', 
      template: 'src/views/index.html', 
      alwaysWriteToDisk: true 
     }), 
     new HtmlWebpackHarddiskPlugin(), 
     new webpack.NamedModulesPlugin(), 
     new webpack.HotModuleReplacementPlugin() 
    ], 
    devtool: 'inline-source-map', 
    devServer: { 
     contentBase: path.join(__dirname, 'dist'), 
     compress: true, 
     hot: true, 
     inline: true, 
     open: true, 
    }, 
    module: { 
     rules: [ 
      { 
       test: /\.css$/, 
       use: [ 
        'style-loader', 
       'css-loader', 
      ] 
      }, 
      { 
       test: /\.(png|svg|jpg|gif)$/, 
       use: [ 
        'file-loader', 
       ] 
      } 
     ] 
    } 
}; 

マイスクリプト：以下の私の設定ホットリロードがCSSやJSのために正常に動作し、私はHTMLが働き続けるためにHMRが、少なくとも期待されるオートリフレッシュをサポートしていません理解して...

。 json

"scripts": { 
    "dev": "webpack-dev-server --config webpack.config.js", 
    "prod": "cross-env NODE_ENV=production webpack -p --config   webpack.config.js" 
}, 

Answer 1

これが「正しい」方法であるかどうかはわかりません。しかし、これは私のために働いています。

devServer: { 
    **contentBase: resolve('src/views'),** 
    open: true, 
    hot: true, 
    stats: "errors-only", 
    overlay: true, 
    **watchContentBase: true** 
}, 

これは私には意味をなすようには見えませんが、あなたがtrueにwatchContentBaseを設定し、「DIST」にcontentBaseを指している場合、あなたはHMRを失い、すべての変更（CSS/JSファイルへのイベント）が発生します私が目指していたものではない完全なリロード。

以下の私のSRC構造：

/ src 
- images 
- js 
- sass 
- views 

私も同じ問題に苦しむように見えるVUE-CLIを見ていました。 index.htmlへの変更は反映されません（ページ全体のリロードを開始しません）。