这是我参与「第四届青训营 」笔记创作活动的第21天
前端基础班第13节:vite知识体系。
一.为什么需要构建工具
前端工程的痛点
前端构建工具的意义
二.什么是vite
1.新一代前端构建工具
2.业界案例
3.当下问题
4.两大行业趋势
5.基于原生ESM的开发服务优势
6.基于Esbuild的编译性能优化
7.内置web构建能力
三.如何使用vite
1.项目初始化
提前安装pnpm
2.使用Scss&CSS Modules
3.使用静态资源
4.使用HMR
5.生产环境的Tree Shaking
四.vite整体架构
关键技术:
1.依赖预打包
2.单文件编译
3.代码压缩
4.插件机制
五.vite进阶路线
1.深入双引擎
2.vite插件开发
示例:
3.代码分割(拆包)
4.JS编译工具(Babel)
5.语法安全降级
6.服务端渲染
7.深入了解底层标准
8.vite社区生态