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启用时如何使自动重新加载工作

回答

相关问题