动手编写一个简易的webpack

模块化：增强代码可读性和维护性

1. 传统的网页开发转变成Web APPs开发
2. 代码复杂度在逐步增高
3. 分离的JS文件、模块，便于后续代码的维护性
4. 部署时希望把代码优化成几个HTTP请求

常见的几种模块化方式

• ES module

• CJS（CommonJS）

• AMD

AST基础知识

复习一下webpack的模块机制

动手实现一个简易的webpack

1. 可以将ES6语法转换成ES5的语法

• 通过babylon生成AST
  

• 通过babel-core将AST重新生成源码
  

2. 可以分析模块之间的依赖关系

• 通过babel-traverse的ImportDeclaration方法获取依赖属性

3. 生成的JS文件可以在浏览器中运行

参考

程柳锋 极客时间 《玩转webpack》 66-67讲