公共代码提取功能是针对多入口文件的;

  背景:在pageA.js和pageB.js中分别引用subPageA.js和subPageB.js

  webpack.config.js文件:

 var path = require('path')
module.exports = {
entry:{
pageA:'./src/pageA.js',
pageB:'./src/pageB.js'
},
output: {
filename: "[name].js",
path:path.resolve(__dirname,'./dist')
},
optimization: {
splitChunks:{
cacheGroups: {
vender:{
test:/node_modules/,
chunks:'initial',
name:'vender',
priority:10
},
utils:{
chunks:'initial',
name:'utils',
minSize:0
}
}
}
}
}

webpack配置提取公共代码的更多相关文章

  1. webpack散记---提取公共代码

    (1)作用: 减少代码冗余 提高加载速度 (2)来源 commonsChunkPlugin webpack.optimize.CommonsChunkPlugin (3)配置 { plugins:[ ...

  2. webpack CommonsChunkPlugin 提取公共代码

    1.项目结构 2.部分代码 module.js console.log('module.js'); index文件夹下的index.js require('../module.js'); consol ...

  3. webpack学习笔记--提取公共代码

    为什么需要提取公共代码 大型网站通常会由多个页面组成,每个页面都是一个独立的单页应用. 但由于所有页面都采用同样的技术栈,以及使用同一套样式代码,这导致这些页面之间有很多相同的代码. 如果每个页面的代 ...

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

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

  5. 基于webpack实现多html页面开发框架六 提取公共代码

    一.解决什么问题 1.如果a.js和b.js都引用了common.js,那在打包的时候common.js会被重复打入到a.js和b.js,造成重复打包 2.单独打包common.js对性能有帮助,浏览 ...

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

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

  7. webpack4 系列教程(三): 多页面解决方案--提取公共代码

    这节课讲解webpack4打包多页面应用过程中的提取公共代码部分.相比于webpack3,4.0版本用optimization.splitChunks配置替换了3.0版本的CommonsChunkPl ...

  8. 记webpack下提取公共js代码的方法

    环境: webpack4.6 + html-webpack-plugin 多页面多入口 经多次研究,稍微靠谱可用的配置 optimization: { splitChunks: { minSize: ...

  9. webpack配置之代码优化

    前面的话 前面介绍了webpack的基本配置,本文将详细介绍webpack中关于代码优化的配置 打包公共代码 CommonsChunkPlugin 插件,是一个可选的用于建立一个独立文件(又称作 ch ...

随机推荐

  1. iOS App转让流程详情教程篇

    最近对公司旗下两款app进行转让,正好记一下操作流程: 1.登录iTunes发布网站,找到app,查看App信息下方有个[转让 App] 按钮. 2.点进去,是如下界面,里面包含是否满足转让条件,理论 ...

  2. Linux实例安装VNC Server实现图形化访问

    引自阿里云: https://help.aliyun.com/knowledge_detail/41530.html

  3. 树莓派进阶之路 (034) - 基于linux的ftp脚本

    基于linux的ftp脚本: #!/bin/sh cd echo "彻底卸载原有的ftp" sudo apt-get remove --purge vsftpd #(--purge ...

  4. Swift 封装

    前言 封装主要有两大目的:一是为了我们使用数据更加方便,二是为了数据保护. 1.Swift 访问修饰符 在 Swift 语言中,访问修饰符也分为三类,分别是 private.internal.publ ...

  5. SQL SERVER 2008自动发送邮件(完整版)

    这两天都在搞这个东西,从开始的一点不懂,到现在自己可以独立的完成这个功能!在这个过程中,CSDN的好多牛人都给了我很大的帮助,在此表示十二分的感谢!写这篇文章,一是为了巩固一下,二嘛我也很希望我写的这 ...

  6. 基于matplotlib的数据可视化 - 笔记

    1 基本绘图 在plot()函数中只有x,y两个量时. import numpy as np import matplotlib.pyplot as plt # 生成曲线上各个点的x,y坐标,然后用一 ...

  7. Git Note

    Git 参考 http://chengshiwen.com/article/head-first-git/ 文件状态 Git目录: (git directory),亦即Git仓库,一般对应项目根目录下 ...

  8. JAVA环境变量的脚本

    简单的一个脚本,用于自动设置环境变量.把代码拷贝,另存为javaEnv.bat.安装完Java 2 SDK之后,开一个命令行窗口,输入javaEnv java2SDKDir(java2SDKDir是你 ...

  9. golang 学习笔记 ---Sizeof

    unsafe.Sizeof浅析 package main import "unsafe" import "fmt" func main() { slice := ...

  10. 小而美的ghost driver

    做过selenium自动化项目的同学应该都遇到过这样的问题:测试用例太多,运行速度过慢导致团队成员怨声载道. 于是便有了selenium grid和多线程运行selenium测试用例的方法.这些方法各 ...