最近使用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. Apollo 分布式配置中心理论到实践

    携程开源的配置管理中心(统一管理各种应用配置的基础服务组件),能够集中化管理应用的不同环境,不同集群的配置,配置修改后能够实时推送到应用端,适合微服务配置管理场景.Apollo包括服务端和客户端. 在 ...

  2. SpringBoot 启动类的原理

    SpringBoot启动类上使用 @SpringBootApplication注解,该注解是一个组合注解,包含多个其它注解.和类定义(SpringApplication.run)要揭开 SpringB ...

  3. Django笔记十之values_list指定字段取值及distinct去重处理

    这篇笔记将介绍 reverse.distinct.values 和 values_list 的用法. 本篇笔记目录如下: reverse() values() values_list() distin ...

  4. java代码审计-CSRF

    0x01 前言 CSRF跨站请求伪造(Cross-site request forgery),当某个接口没有设置CSRF验证,点击了别人恶意的链接,可能会造成对这个接口发送相应的数据,造成某个数据被更 ...

  5. 集合-ArrayList 源码分析

    1.概述 ArrayList 是一种变长的集合类,基于定长数组实现.ArrayList 允许空值和重复元素,当往 ArrayList 中添加的元素数量大于其底层数组容量时,其会通过扩容机制重新生成一个 ...

  6. 在Kubernetes部署GitLab

    在Kubernetes部署GitLab 前置条件 已安装Helm工具已部署NFS自动创建PVC 使用HELM安装 [root@k8s-master01 ~]# helm repo add gitlab ...

  7. [Java]变量及其初始化 与 类对象的初始化

    1 变量 1.1 变量的[定义] 1.2 变量的[作用域] 1.3 变量的[初始值] 1.4 补充:缓存变量 1.5 变量的[分类]与[未初始化情况] 2 类对象 2.1 类对象的初始化/构造过程 1 ...

  8. day33:进程锁&事件&进程队列&进程间共享数据

    目录 1.锁:Lock 2.信号量:Semaphone 3.事件:Event 4.进程队列:Queue 5.生产者和消费者模型 6.JoinableQueue 7.Manager:进程之间共享数据 锁 ...

  9. c++基本数据结构

    基本数据结构: 一.线性表 1.顺序结构 线性表可以用普通的一维数组存储. 你可以让线性表可以完成以下操作(代码实现很简单,这里不再赘述): 返回元素个数. 判断线性表是否为空. 得到位置为p的元素. ...

  10. React课堂笔记2

    一.JSX 1.1.什么是JSX JSX = JavaScript XML,这是React官方发明的一种JS语法(糖) 概念:JSX是 JavaScript XML(HTML)的缩写,表示在 JS 代 ...