webpack-dev-server 提取公用模块,ExtractTextPlugin提取css修改保存后热更新出错

发布于 2022-09-04 20:08:56 字数 1449 浏览 17 评论 0

错误信息:
clipboard.png
webpack dev配置模块:

import webpack from 'webpack';
import webpackMerge from 'webpack-merge';
import commonConfig from './baseConfig';
import * as config from './pathConfig';

export default function () {
    return webpackMerge(commonConfig(), {
        devtool: 'cheap-module-source-map',
        output: {
            path: config.DEV_PATH,
            publicPath: '/assets',
            filename: 'js/[name].js',
            sourceMapFilename: 'js/[name].map',
        },
        devServer: {
            contentBase: config.DEV_PATH,
            hot: true,
            publicPath: '/assets',
        },
        plugins: [
            new webpack.HotModuleReplacementPlugin(),
            new webpack.NamedModulesPlugin(),
        ],
    });
}

commonConfig是生产和开发的公用模块!
问题:如果entry中是单入口文件可以正常热更新,如果不是单入口
比如:

entry: {
      index: config.SRC_ROOT,
      vendor: 'moment',
},

必须在package中加入--hot
"start": "webpack-dev-server --hot --env=production",才可以自动刷新模块,如果不加便不能执行,但是在cil中加入了hot,修改更新css就会报Maximum call stack size exceeded错误!中途由查到一个朋友说的cil加入了hot HotModuleReplacementPlugin便不能在plugin中添加,有尝试这样做,结果就是必须手动刷新!

源码 https://github.com/Princeraul...

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文