Vite知识总结
2021-12-03 10:52:34 1 举报
AI智能生成
Vite官方文档的总结
作者其他创作
大纲/内容
JS原生机制缺乏模块化方式
工具抓取、处理和链接我们的源码模块到文件中使其可以运行在浏览器
打包
启动几分钟
HMR 更新需要数秒
几千个模块
JS代码量增大出现性能瓶颈
浏览器支持ES模块之前
现实问题
HTTP/2多路复用也不能改善
嵌套导入缓慢
树摇
tree-shaking
懒加载
更好缓存
chunk分割
性能优化
虽然快
css处理 代码分割 不够成熟
选择rollup
EsBuild为什么
问什么生产环境仍需打包
Snowpack
Vite与其他Bundless工具区别
为什么选择Vite
法语意为 \"快速的\",发音 /vit/
Vite
支持Vue sfc
支持JSX
基于原生ES丰富的内建功能
热更新模块
开发服务器
基于Rollup
静态资源优化
构建指令
新型前端构建工具
支持原生ES模块导入
开发环境
支持ES模块浏览器
支持非ES模块浏览器
通过@vitejs/plugin-legacy
生产环境
浏览器
yarn create vite js
js
yarn create vite vue --template vue
vue
现在git资源工具
degit makes copies of git repositories.
degit
使用社区模板
Helloworld
总览
提高页面加载速度
CommonJS / UMD 转换为 ESM 格式
原生不支持的裸模块加载 模块文件没有没有扩展名
基于esbuild
NPM 依赖解析和预构建
Vue 单文件组件
React Fast Refresh
内置
模块热重载
只转义不做类型检查
不支持类型信息转义
esbuild
TypeScript
Vue3.0
Vue2.0
Vue
JSX
CSS
静态资源处理
JSON
Glob 导入
Web Assembly
Web Worker
动态导入 Polyfill
CSS 代码分割
预加载指令生成
异步 Chunk 加载优化
构建优化
功能详解
依赖预构建
构建生产版本
部署静态站点
环境变量与模式
服务端渲染
后端集成
Vite生态
Vite教程
0 条评论
回复 删除
下一页