webpack

webpack和react的关系就像豆浆和油条。
在使用react的过程中接触webpack，是构建react项目不可获取的一环。
感觉学习React的同时，也进行了Webpack工具的使用。

{
  "plugins": [
    ["import", { "libraryName": "antd", "libraryDirectory": "es", "style": "css" }] // `style: true` 会加载 less 文件
  ]
}

-Webpack编译时压缩代码

new webpack.optimize.UglifyJsPlugin

Webpack将React的JSX语法编译，压缩代码和图片，编译ES6代码，处理CSS各浏览器兼容问题
Webpack工作流程：

entry：入口点，webpack会从入口点设置的js文件开始对项目进行构建，过程中，所有入口点通过import或者require依赖的包，都会被打包到output中制定的文件和路径；
output：设置打包后文件的文件名和输出路径；
module：主要是loaders，loaders是webpack进行打包的解析器，css、vue、babel、less都需要用npm安装相应的loader，webpack才能对该格式的文件进行解析和处理；
plugins：是一些webpack的打包插件，跟解析的语言无关，用来辅助构建，提供丰富的附加功能。

一般来说Webpack用于构建单页应用，或者由于项目要求，也可以用于构建多页应用

使用 ES6 进行开发
期望使用面向对象开发（class）
自动压缩合并 CSS 和 JS 文件
使用 ESLint 进行代码检查
自动生成 HTML 文件
自动抽取 CSS 文件