1. externals的使用（深入浅出webpack之externals的使用）
externals: 防止将某些 import 的包(package)打包到 bundle 中，而是在运行时(runtime)再去从外部获取这些扩展依赖(external dependencies)。使用externals配置后，依旧可以在代码中通过CMD、AMD或者window/global全局的方式访问。
例如，从 CDN 引入 jQuery
（1）在HTML中引入第三方库的cdn
（2）在webpack.config.js中配置externals
这样就剥离了那些不需要改动的依赖模块，下面展示的代码还可以正常运行：
2. CommonsChunkPlugin 提取公共代码（详见详解CommonsChunkPlugin的配置和用法）
CommonsChunkPlugin主要是用来提取第三方库和公共模块，避免首屏加载的bundle文件或者按需加载的bundle文件体积过大，从而导致加载时间过长
可配置的属性：
- name：可以是已经存在的chunk（一般指入口文件）对应的name，那么就会把公共模块代码合并到这个chunk上；否则，会创建名字为name的commons chunk进行合并
- filename：指定commons chunk的文件名
- chunks：指定source chunk，即指定从哪些chunk当中去找公共模块，省略该选项的时候，默认就是entry chunks
- minChunks：既可以是数字，也可以是函数，还可以是Infinity
可以像这样设置webpack.config.js：
这样就会把公共模块代码合并到base.js文件中
（注意：如果在plugins配置了new webpack.optimize.CommonsChunkPlugin，生成了一个公共文件，页面必须先引用这个公共文件，再引用其他的js文件）
3.webpack分离单独打包css文件
（1）安装插件
（2）配置webpack.config.js：
（3）在编译之前安装需要用到的style-loader和css-loader
（4）在终端进行webpack
webpack的一些使用方法
原文地址：https://www.cnblogs.com/SofiaTJU/p/9454291.html