Vite从⼊门到精通,玩转新时代前端构建法则
### 第1章 Vite 的概要介绍
#### 本章将向⼤家介绍什么是 Vite、Vite 的特⾊,并辅以介绍前端构建⼯具的发展历史进⾏对⽐,帮助同学们对 Vite 有个初步的印象。
1-1 关于课程你需要了解的都在这⾥ (08:44)
1-2 什么是 Vite (07:15)
1-3 Vite 对⽐其他构建⼯具的优势 (08:52)
1-4 【拓展知识】前端构建⼯具发展史
1-5 【讨论题】谈谈你对于构建⼯具得认识
### 第2章 Vite 的基础应⽤
#### 本章中我们会学习,如何使⽤ Vite 搭建不同前端框架的项⽬,如何配置⼀些常见的功能⽐如 CSS、静态⽂件等来达到⽇常使⽤的⽬的。2-1 Vite 的优势 (10:22)
2-2 Vite 创建 Vue3 项⽬ (12:22)
2-3 Vite 创建 Vue2 的项⽬ (08:30)
2-4 Vite 创建 React 的项⽬ (07:21)
2-5 Vite 中使⽤ CSS 的各种功能 (15:47)
2-6 Vite 中使⽤ Typescript (21:19)
2-7 Vite 中处理静态资源的⽅法 (09:44)
搭建ssr服务器教程
2-8 Vite 集成 eslint 和 prettier (12:38)
2-9 Vite 中得 env 环境变量 (12:21)
### 第3章 Vite 的⾼级应⽤
#### 本章讲解 Vite 的⼀些⾼级功能,⽐如热更新,服务端渲染,集成到 node 服务中等,让同学们在遇到⼀些特殊情况时也能够得⼼应⼿。3-1 【知识拓展】什么是热更新
3-2 Vite 中的 HMR 热更新功能 (14:02)
3-3 Vite 的 glob-import 批量导⼊功能 (10:18)
3-4 Vite 性能揭秘---预编译优化 (11:35)
3-5 在⾮ Node 服务中集成 Vite (18:17)
3-6 Nodejs 集成 Vite 开发时的 SSR (16:39)
3-7 Node 集成正式 build 的 Vite 应⽤的 SSR (15:12)
3-8 通过 SSR 功能实现静态站点导出 (11:54)
3-9 Vite 配置项⼀览 (19:55)
3-10 【任务题】使⽤vite更新⼀个你的现有项⽬
### 第4章 Rollup 系统学习
#### Vite 的内核是围绕 Rollup 进⾏构建,因此,想要更好得理解 Vite 学习 Rollup 是必须的。本章将⼀起学习 Rollup 的核⼼应⽤。
4-1 Rollup 介绍 (10:36)
4-2 【知识拓展】ES Module详解
4-3 Rollup 的命令⾏使⽤ (19:37)
4-4 Rollup 配置⽂件使⽤ (18:38)
4-5 Rollup 插件功能解析(上) (14:59)
4-6 Rollup 插件功能解析(下) (19:28)
4-7 Rollup 常⽤插件盘点 (13:32)
4-8 Esbuild 的使⽤教程 (19:03)
4-9 Esbuild 插件的开发⽅式 (20:43)
4-10 【任务题】⽤rollup打包⼀个vue或者react项⽬
4-11 【讨论题】谈谈你对esbuild未来的预测
### 第5章 Vite 插件系统详解
#### 本章详细介绍 Vite 的插件系统,包括插件能做什么、如何实现的、并通过讲解官⽅的Vite-Vue3-jsx 插件的源码来讲解 Vite 插件的实现原理。
5-1 Vite 插件开发概述 (08:58)
5-2 Vite 插件的执⾏时机 (09:22)
5-3 Vite 插件 API 详解 (15:22)
5-4 HMR-API 详细解析(上) (14:57)
5-5 HMR-API 详细解析(下) (17:50)
5-6 vite-vue3-jsx 插件概览 (09:49)
5-7 vite-vue3-jsx 插件源码解析之配置和产出 (17:44)
5-8 vite-vue3-jsx 插件详解之 HMR (18:18)
5-9 vite-vue3-jsx 插件解析之 SSR (10:20)
### 第6章 实战 Vite 插件
#### 本章将带领同学们实现⼀个真实可⽤的 Vite 插件。应⽤该插件,可以轻松实现⽤ MDX语法来写页⾯,并且可实现主题切换内置组件等功能,让你快速搞定静态页⾯。
6-1 【拓展知识】Ast语法树介绍
6-2 MDX 语法介绍和插件设计 (08:05)
6-3 MDX 的使⽤以及 mdx-loader 的原理 (16:07)
6-4 MDX 如何配合 React 使⽤ (15:55)
6-5 插件 Vue 版本基础实现 (13:45)
6-6 Vue3 的 mdx 函数实现 (24:46)
6-7 Vite-mdx 插件 vue3 联调 (10:08)
6-8 Vite-mdx 插件集成 react (13:59)
6-9 Vite-mdx 插件进⼀步完善 (08:14)
6-10 独⽴开发 vite-mdx 插件并发布到 npm (17:52)
6-11 解决发布 vite-mdx 插件的问题 (05:15)
### 第7章 Vite 源码解析
#### 本章将带领⼤家⼀起来从源码层⾯真正理解 Vite。我们会从 Vite的 dev server、热更新、如何编译⽂件这些⾓度来完整展⽰ Vite 的核⼼实现原理,让同学们不仅会⽤⽽是真正的理解 Vite
7-1 Vite 源码解析-⽬录结构和构建 (11:17)
7-2 启动Vite 的 createServer (19:37)
7-3 resolveConfig 解析配置过程解析(上) (11:20)
7-4 resolveConfig 解析配置过程解析(下) (11:54)
7-5 pluginContainer 作⽤和源码解析 (14:04)
7-6 JS 请求处理和模块图谱源码解析 (21:57)
7-7 vite-dev-server 中的 HMR 处理 (15:45)
7-8 vite 预编译优化源码解析 (25:24)
7-9 总结 (06:51)
7-10 【任务题】挑选vite的内部plugin,进⾏源码解析并分享

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。