Module Babel Webpack

Module 是什么

• 什么是模块
• 什么是模块系统

Module 的基本用法

• 使用 Module 模块化之前的例子
• 使用 script 标签加载模块
• 分析 Module 解决的问题

Module 的两种导出和导入

• export default 导出和对应的 import 导入
• export 导出和对应的 import 导入
• 模块顶层的 this 指向

export default 和对应的 import

• 认识导出和导入
• 基本用法

export 和对应的 import基本用法

• 多个导出
• 导出导入时起别名
• 整体导入
• 同时导入

Module 的注意事项

• import 关键字和 import() 函数
• 导入导出的复合写法

认识 Babel

• Babel 是什么
• 使用 Babel解释编译结果

Babel 的使用方式

• Babel 有哪些使用方式
• 在命令行工具中使用 Babel

使用 Babel 前的准备工作

• 什么是 Node.js 和 npm
• 安装 Node.js
• 初始化项目
• 安装 Babel 需要的包

使用 Babel 编译 ES6 代码

• 编译的命令
• Babel 的配置文件

Webpack 是什么

• 认识 Webpack
• 理解 Webpack

Webpack 初体验

• 初始化项目
• 安装 webpack 需要的包
• 配置 webpack
• 打包并测试

Webpack 的 4 个核心概念

• entry
• output
• loader
• plugins