HMR啓用時如何使自動重新加載工作

我一直在嘗試多次配置webpack。每次我開始這個過程時，自動重新加載都可以正常工作，直到我爲web-dev-server啓用--hot，那麼對html的任何更改都沒有影響，沒有錯誤，沒有任何內容，只是登錄終端已經存在更改以及瀏覽器控制檯上的日誌，無需更新。熱重載工作正常的CSS和JS，我理解HTML不支持HMR但至少希望自動刷新繼續工作......HMR啓用時如何使自動重新加載工作

我的配置如下：

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', 
       ] 
      } 
     ] 
    } 
};

我的包腳本。 json

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

來源

2017-10-22 jjaulimsing

還沒有測試過這個，但嘗試[reload-html-webpack-plugin]（https://github.com/andrewcoelho/reload-html-webpack-plugin） – andykenward

謝謝，我已經嘗試了上面的許多其他解決方案，但每次自動重新加載開始工作時，我失去CSS上的HMR（假設還有JS，還沒有測試過）。我想有自動重新加載在HTML和CSS和JS的HMR。 – jjaulimsing

我不確定這是否是實現它的「正確」方法。但是這對我來說有以下的補償。

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

這似乎沒有道理給我，但是，如果你設置watchContentBase爲true，並點contentBase爲「DIST」，你失去HMR任何改變（事件的CSS/JS文件）會導致完全重新加載這不是我想要的。

我SRC結構如下：

/ src 
- images 
- js 
- sass 
- views

我也看了一下VUE-CLI這似乎是從同一個問題的困擾。對index.html所做的任何更改都不會反映出來（不會觸發整頁重新加載）。

來源

2017-11-12 19:57:27 jjaulimsing

HMR啓用時如何使自動重新加載工作

回答

相關問題