webpack运行项目-关于 webpack 的一些事情

1.什么是webpack？

Web开发中常用的静态资源主要有JavaScript、CSS、图片、Jade等文件。 在 webpack 上，静态资源文件称为模块。 webpack是一个Module Bunler（模块打包工具），兼容各种js编写规范，并且可以处理模块之间的依赖关系，具有更强大的js模块化功能。 Webpack对它们进行统一管理并打包发布。 其官方主页用下图来说明Webpack的作用。

2.为什么使用webpack？

1.兼容CommonJS、AMD、ES6句型

2.支持js、css、图片等资源文件打包

3.串联模块加载器和插件机制使其更加灵活和可扩展，例如提供对CoffeeScript和ES6的支持

4.有独立的配置文件webpack.config.js

5.可以将代码分为不同的chunkwebpack运行项目，实现按需加载，减少初始化时间

6.支持SourceUrls和SourceMaps，方便调试

7.拥有强大的Plugin插座，大部分都是内部插件webpack运行项目，使用更灵活

8. webpack使用异步IO并具有多级缓存。这使得webpack在增量编译上更快、更有动力

3.安装webpack并运行介绍

创建目录结构

4.引入webpack依赖

npm install webpack -g //全局安装webpack

5. 创建配置文件

在项目根目录下创建三个及以上webpack配置文件

(1) webpack.base.config.js //常用配置放在这里（可以被插件继承）

(2) webpack.develop.config.js //开发环境使用的配置文件

(3) webpack.publish.config.js //生产环境使用的配置文件

6.修改配置文件

注意：开发环境的配置与生产环境的配置不同。 具体配置内容请参考后续章节的介绍