• webpack-merge 负责合并配置项，如A是基本配置，开发模式配置 = A + 额外配置，即在A的基础上进行配置补充。
• babel 将ES6语法编译成ES5，并提供babel-polyfill垫片。
• html-webpack-plugin 自动将模板html文件引入相关的chunk。
• mini-css-extract-plugin 将 css 分离出 js。
• sass-loader，scss-loader 编译sass语法。
• post-css autoprefixer 自动补齐css hack前缀。
• purify-css-Webpack 消除冗余的css代码。
• webpack-dev-server 提供简单的web服务器，代码热更新。（由于配置了多入口，导致html、css无法热更新，需要重新手动刷新页面。但js的热更新没有影响。）
• file-loader 解决图片路径问题, url-loader 转图片为 base64。
• copy-webpack-plugin 拷贝静态文件。

使用前需要先对下载对应依赖。

在项目根目录下打开命令行，输入：npm install。 等待一段时间后，若出现报错，一般是依赖版本问题，根据提示修改就好。

开发时源码应放在 src/ 下。

src/assets/ 存放静态文件，一般为图片资源、字体文件等。

src/img/ 存放一些在css中会用到图片，因为考虑到url-loader会对图片进行转化处理，所以和assets分开。

src/pages/ 存放所有页面的 html、js、css文件。

其中 src/pages/ 的格式如下：

1. pageA(dir) —— html、css、js文件
2. pageB(dir) —— html、css、js文件
3. pageC(dir) —— html、css、js文件

npm run dev

启动项目的开发模式，具有热更新，自动访问项目的功能。

npm run build

启动项目的打包模式，一切文件会进行压缩和打包。

更多的命令在项目根目录下的 package.json 中的 scripts 中。