javascript – webpackDevMiddleware不自动重新加载

2019-07-17 09:36:21 阅读：239 来源： 互联网

标签：javascript webpack express html-webpack-plugin webpack-dev-middleware

所以我使用webpack dev中间件如下：

const compiledWebpack = webpack(config),
          app             = express(),
          devMiddleware   = webpackDevMiddleware(compiledWebpack, {
            historyApiFallback: true,
            publicPath: config.output.publicPath,
            overlay: {
              warnings: true,
              errors: true
            },
            compress: true,
            stats: { colors: true }
          })


    app.use(devMiddleware)




    app.get('*', (req, res) => {
      // Here is it! Get the index.html from the fileSystem
      const htmlBuffer = devMiddleware.fileSystem.readFileSync(`${config.output.path}/index.html`)

      res.send(htmlBuffer.toString())
    })

    app.listen(PORT, function () {})

    console.log('Running on port ' + PORT)

但是,出于某种原因,我没有得到实时重装.我也没有获得叠加功能.我正在使用此设置,因为我使用的是webpackhtmlplugin.

我觉得我在这里错过了一个简单的概念:(任何想法？

解决方法:

对于实时重新加载,您还需要添加webpack-hot-middleware.

在您的服务器中,您必须添加：

const webpackHotMiddleware = require('webpack-hot-middleware');

const hotMiddleware = webpackHotMiddleware(compiledWebpack);
app.use(hotMiddleware);

您还需要将“webpack-hot-middleware / client”添加到您的条目中,并将webpack.HotModuleReplacementPlugin添加到您的webpack配置中的插件中：

entry: [
  'webpack-hot-middleware/client',
  './src/index.js' // Your entry point
],
plugins: [
  new webpack.HotModuleReplacementPlugin()
]

有关更多信息,请参阅Installation & Usage.

标签：javascript,webpack,express,html-webpack-plugin,webpack-dev-middleware
来源： https://codeday.me/bug/20190717/1487190.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

javascript – webpackDevMiddleware不自动重新加载