[523] Vite 从入门到精通，玩转新时代前端构建法则 - 课程对比栏

网盘链接：

1. Vite 的概要介绍

• 1-1 关于课程你需要了解的都在这里
• 1-2 什么是 Vite
• 1-3 Vite 对比其他构建工具的优势
• 1-4 【拓展知识】前端构建工具发展史
• 1-5 【讨论题】谈谈你对于构建工具得认识

2. Vite 的基础应用

• 2-1 Vite 的优势
• 2-2 Vite 创建 Vue3 项目
• 2-3 Vite 创建 Vue2 的项目
• 2-4 Vite 创建 React 的项目
• 2-5 Vite 中使用 CSS 的各种功能
• 2-6 Vite 中使用 Typescript
• 2-7 Vite 中处理静态资源的方法
• 2-8 Vite 集成 eslint 和 prettier
• 2-9 Vite 中得 env 环境变量

3. Vite 的高级应用

• 3-1 【知识拓展】什么是热更新
• 3-2 Vite 中的 HMR 热更新功能
• 3-3 Vite 的 glob-import 批量导入功能
• 3-4 Vite 性能揭秘—预编译优化
• 3-5 在非 Node 服务中集成 Vite
• 3-6 Nodejs 集成 Vite 开发时的 SSR
• 3-7 Node 集成正式 build 的 Vite 应用的 SSR
• 3-8 通过 SSR 功能实现静态站点导出
• 3-9 Vite 配置项一览
• 3-10 【任务题】使用vite更新一个你的现有项目

4. Rollup 系统学习

• 4-1 Rollup 介绍
• 4-2 【知识拓展】ES Module详解
• 4-3 Rollup 的命令行使用
• 4-4 Rollup 配置文件使用
• 4-5 Rollup 插件功能解析（上）
• 4-6 Rollup 插件功能解析（下）
• 4-7 Rollup 常用插件盘点
• 4-8 Esbuild 的使用教程
• 4-9 Esbuild 插件的开发方式
• 4-10 【任务题】用rollup打包一个vue或者react项目
• 4-11 【讨论题】谈谈你对esbuild未来的预测

5. Vite 插件系统详解

• 5-1 Vite 插件开发概述
• 5-2 Vite 插件的执行时机
• 5-3 Vite 插件 API 详解
• 5-4 HMR-API 详细解析（上）
• 5-5 HMR-API 详细解析（下）
• 5-6 vite-vue3-jsx 插件概览
• 5-7 vite-vue3-jsx 插件源码解析之配置和产出
• 5-8 vite-vue3-jsx 插件详解之 HMR
• 5-9 vite-vue3-jsx 插件解析之 SSR

6. 实战 Vite 插件

• 6-1 【拓展知识】Ast语法树介绍
• 6-2 MDX 语法介绍和插件设计
• 6-3 MDX 的使用以及 mdx-loader 的原理
• 6-4 MDX 如何配合 React 使用
• 6-5 插件 Vue 版本基础实现
• 6-6 Vue3 的 mdx 函数实现
• 6-7 Vite-mdx 插件 vue3 联调
• 6-8 Vite-mdx 插件集成 react
• 6-9 Vite-mdx 插件进一步完善
• 6-10 独立开发 vite-mdx 插件并发布到 npm
• 6-11 解决发布 vite-mdx 插件的问题

7. Vite 源码解析

• 7-1 Vite 源码解析-目录结构和构建
• 7-2 启动Vite 的 createServer
• 7-3 resolveConfig 解析配置过程解析（上）
• 7-4 resolveConfig 解析配置过程解析（下）
• 7-5 pluginContainer 作用和源码解析
• 7-6 JS 请求处理和模块图谱源码解析
• 7-7 vite-dev-server 中的 HMR 处理
• 7-8 vite 预编译优化源码解析
• 7-9 总结
• 7-10 【任务题】挑选vite的内部plugin，进行源码解析并分享