最近使用webpack 进行react 依赖抽离时发现原本的webpack.optimize.CommonsChunkPlugin已经不能使用了


打包时提示



Error: webpack.optimize.CommonsChunkPlugin has been removed, please use config.optimization.splitChunks instead.

官方仔细一看文档发现

The CommonsChunkPlugin has been removed in webpack v4 legato. To learn how chunks are treated in the latest version, check out the SplitChunksPlugin.

原来是得学着使用SplitChunksPlugin来构建了,

这个更是简单了,直接在module.exports增加如下案例代码即可

  optimization: {
splitChunks: {
cacheGroups: {
vendor: {
test: /[\\/]node_modules[\\/](react|react-dom)[\\/]/,
name: 'vendor',
chunks: 'all',
}
}
}
}

遗憾的是当时试着将依赖生成多个js文件并未成功

Error: webpack.optimize.CommonsChunkPlugin has been removed的更多相关文章

  1. Error: webpack.optimize.UglifyJsPlugin has been removed, please use config.optimizat

    按照教程上配置文件如下: var webpack=require('webpack'); var HtmlwebpackPlugin=require('html-webpack-plugin'); v ...

  2. 关于webpack.optimize.CommonsChunkPlugin的使用二

    Note:当有多个入口节点的时候,只有所有入口节点都引入了同一个模块的时候,webpack.optimize.CommonsChunkPlugin才会将那个模块提取出来,如果其中一个入口节点没有引入该 ...

  3. webpack.optimize.CommonsChunkPlugin插件的使用

    方式一,传入字符串参数 new webpack.optimize.CommonsChunkPlugin('common.js'), // 默认会把所有入口节点的公共代码提取出来,生成一个common. ...

  4. 使用webpack.optimize.CommonsChunkPlugin提供公共代码

    在webpack4里使用webpack.optimize.CommonsChunkPlugin时,报错,webpack4删除了常用的 CommonsChunkPlugin ,提示我们用config.o ...

  5. webpack.optimize.CommonsChunkPlugin

    打包第三方控件:比如jquery,angular,bootstrap.... const CommonsChunkPlugin = require("webpack/lib/optimize ...

  6. [转] 用webpack的CommonsChunkPlugin提取公共代码的3种方式

    方式一,传入字符串参数 new webpack.optimize.CommonsChunkPlugin(‘common.js’), // 默认会把所有入口节点的公共代码提取出来,生成一个common. ...

  7. 详解用webpack的CommonsChunkPlugin提取公共代码的3种方式(注意webpack4.0版本已不存在)

    Webpack 的 CommonsChunkPlugin 插件,负责将多次被使用的 JS 模块打包在一起. CommonsChunkPlugin 能解决的问题 在使用插件前,考虑几个问题: 对哪些 c ...

  8. webpack关于CommonsChunkPlugin在高版本被移除的替代方案问题

    1.在指南的缓存章节里webpack.config.js文件中,使用new的方法会报错 const webpack = require('webpack'); + new webpack.optimi ...

  9. Can someone explain Webpack's CommonsChunkPlugin

    I get the general gist that the CommonsChunkPlugin looks at all the entry points, checks to see if t ...

  10. webpack.optimize.UglifyJsPlugin配置说明

    https://segmentfault.com/a/1190000008995453?utm_source=tuicool&utm_medium=referral

随机推荐

  1. nginx配置反向代理服务器,实现在https网站中请求http资源

    网站使用nginx作为服务器,协议从http升级为https的注意事项. 具体升级步骤请点击搜索 1.首先,修改宝塔面板配置 选择配置文件,http请求重定向为https.所有80端口请求都重定向为h ...

  2. 存算分离实践:JuiceFS 在中国电信日均 PB 级数据场景的应用

    01- 大数据运营的挑战 & 升级思考 大数据运营面临的挑战 中国电信大数据集群每日数据量庞大,单个业务单日量级可达到 PB 级别,且存在大量过期数据(冷数据).冗余数据,存储压力大:每个省公 ...

  3. Java里if和else的用法

    前言 在上一篇文章中,壹哥给大家讲解了Java里的输入与输出语句,现在你知道怎么用了吗?接下来我们继续往下学习Java里的流程控制语句,今天先给大家讲一下if和else这一对好基友,这个知识点可以说是 ...

  4. Centos 7配置使用nginx反向代理mysql

    背景:由于WEB服务和MySQL数据库服务分开部署的,由于网络问题限制,有时需要通过中间代理服务器跳转连接MySQL,所以需要在中间服务器上配置代理. 1.添加stearm模块 # nginx通常代理 ...

  5. salesforce零基础学习(一百二十五)零基础学习SF路径

    本篇参考: https://boulder-bard-27f.notion.site/Salesforce-Learning-e990864695674f07b99a5f8955770bd4 本篇背景 ...

  6. ACM-刷题记录-14届NEFU校赛

    P2031凯撒密码 #include<bits/stdc++.h> using namespace std; int main(){ string s; int d; while(cin& ...

  7. 开发一个二方包,优雅地为系统接入ELK(elasticsearch+logstash+kibana)

    去年公司由于不断发展,内部自研系统越来越多,所以后来搭建了一个日志收集平台,并将日志收集功能以二方包形式引入各个自研系统,避免每个自研系统都要建立一套自己的日志模块,节约了开发时间,管理起来也更加容易 ...

  8. Chrome浏览器插件 Undo Close Tab (恢复关掉的标签页)

    背景 如果您经常使用Chrome浏览器,也许有时候会意外关闭一个标签页,从而丢失您正在查看的内容.这时您可能会感到非常烦恼,并希望能够迅速找回这个标签页.当然,您可以通过点击浏览器历史记录中的条目来找 ...

  9. [Linux]CentOS查看RPM包依赖问题

    [经典应用案例] 查看此文前,可先查看 此博文中:在安装软件过程中,如何解决的依赖组件问题? [数据库/Linux]CentOS7安装MySQL Percona版(RPM方式) : 2-1 依赖组件问 ...

  10. 腾讯出品小程序自动化测试框架【Minium】系列(七)测试框架的设计和开发

    前言 整个框架的开发及调通是在3月27日晚上22点完成,如下: 这篇文章真的是拖了太久了,久到我居然把代码部分完成后,彻底给忘了,这记性,真的是年纪大了! 框架的设计开发 1.框架搭建设计要素 日志& ...