附录 E 学习资源推荐

附录 E 学习资源推荐

学无止境。Vue 3 的世界很大,这本书只是入门。本章整理了 Vue 官方文档、优质书籍、开源项目、社区博客、视频课程等学习资源,助你在 Vue 之路上走得更远。

E.1 官方文档与教程

Vue 3 官方文档(必读) https://cn.vuejs.org/ Vue 官方文档是最权威的学习资料,内容全面、更新及时。所有 Vue 开发者都应该把官方文档通读一遍,至少把核心章节读懂。

Vue Router 4 文档 https://router.vuejs.org/zh/ Vue 官方路由管理器的文档。

Pinia 文档 https://pinia.vuejs.org/zh/ Vue 官方状态管理库的文档,API 简洁,文档质量很高。

VueUse 文档 https://vueuse.org/ VueUse 是 Vue 3 组合式函数的工具库,文档就是最好的教程。

Vite 文档 https://cn.vitejs.dev/ 下一代前端构建工具的官方文档。

Vue 3 官方 Playground https://play.vuejs.org/ 在线编写和分享 Vue 代码的编辑器,无需安装任何东西。

E.2 优质书籍

书名特点推荐度
《Vue.js 设计与实现》深入 Vue 3 源码,讲解设计思路和实现原理⭐⭐⭐⭐⭐
《Vue.js 3 实战》覆盖 Vue 3 + TypeScript + Vite + Pinia 实战⭐⭐⭐⭐
《深入浅出 Vue.js》Vue.js 2/3 核心源码解析,适合进阶⭐⭐⭐⭐
《Learning Vue.js 3》英文书籍,讲解系统全面⭐⭐⭐
《The Vue.js 3 Workshop》英文实战类书籍,偏重项目练习⭐⭐⭐

特别推荐:如果你想深入理解 Vue 的底层原理,《Vue.js 设计与实现》(作者:梁灏)是必读之选。这本书从源码角度剖析 Vue 的响应式、虚拟 DOM、组件化和编译优化,是 Vue 进阶的圣经。

E.3 开源项目推荐

学习开源项目是提升 Vue 技能的最佳途径。以下是一些优质的 Vue 3 开源项目:

项目名GitHub 地址特点
vitessegithub.com/antfu/vitesseVite + Vue 3 + TypeScript + UnoCSS 最佳实践
vue3-element-admingithub.com/element-plus/ vue3-element-admin基于 Element Plus 的后台管理系统
naive-ui-admingithub.com/tuator/ naive-ui-admin基于 Naive UI 的后台管理系统
** vue3-music**github.com/SevenOutman/ vue3-musicVue 3 音乐播放器
vue3-bloggithub.com/helei0/ vue3-blogVue 3 博客系统
ant-design-vuegithub.com/vueComponent/ ant-design-vueAnt Design 的 Vue 3 版本
element-plusgithub.com/element-plus/ element-plusElement UI 的 Vue 3 版本
headlessui-vuegithub.com/tailwindlabs/ headlessui-vueTailwind 出品的无头组件库
VueUsegithub.com/vueuse/vueuseVue 3 组合式函数工具库源码

如何阅读开源项目

  1. 先看 README,了解项目功能
  2. Clone 到本地,运行起来
  3. 从入口文件开始,顺着路由和组件嵌套关系走读
  4. 重点关注:项目结构设计、状态管理方式、API 封装思路、代码风格

E.4 技术社区与博客

中文社区

名称地址说明
Vue 中文社区https://forum.vuejs.org/c/chinese/Vue 官方中文论坛
稀土掘金https://juejin.cn/大量 Vue 优质文章
思否https://segmentfault.com/t/vuejs问答社区
知乎 Vue 话题https://www.zhihu.com/topic/ vuejs/hotVue 相关讨论

英文社区

名称地址说明
Vue.js Discussionsgithub.com/vuejs/core/discussionsVue 核心团队官方讨论区
Vue.js Landdiscord.gg/vueVue 官方 Discord 服务器
Twitter #vuejstwitter.com/search?q=%23vuejsVue 社区动态

优质博客(个人)

作者博客地址特点
尤雨溪(Evan You)blog.evanyou.me/Vue 创始人,技术深度与广度兼具
霍春阳http://hcysun.me/《Vue.js 设计与实现》作者,源码解析深入
usthehttps://blog.usthem.com/Vue/TypeScript 实践

E.5 视频课程推荐

课程名平台讲师特点
Vue 3 + TypeScript 实战慕课网双越系统全面,适合入门到进阶
Vue3 完全指南Bilibili王红元免费高清,深入原理
Vue3 + Vite + Pinia 实战Bilibili技术胖免费,偏重实战
Vue 3 + Nuxt 3 SSR 实战UdemyMaximilian英文课程,SSR 专题
Advanced Vue 3Vue MasteryEvan You 等官方合作,质量最高

Bilibili 免费优质资源

  • 搜索"Vue 3 教程",播放量最高的几百集视频质量都不错
  • 搜"Vue 3 源码解析",有一些优质的原理讲解视频
  • 搜"Vite 教程",深入理解构建工具

E.6 其他工具推荐

工具名地址用途
Can I Usehttps://caniuse.com/查看浏览器 API 兼容性
Vue DevToolsChrome 扩展商店Vue 调试工具
Vite Playgroundhttps://vite.new/vue在线创建 Vite 项目
TypeScript Playgroundhttps://www.typescriptlang.org/play在线编写 TypeScript
Regex101https://regex101.com/正则表达式测试
JSON Crackhttps://jsoncrack.com/JSON 可视化
Carbonhttps://carbon.now.sh/生成漂亮的代码截图
tldrawhttps://tldraw.com/在线画流程图/架构图

附录小结

本章整理了 Vue 3 学习过程中的必备资源:

  • 官方文档:永远是最好的第一手资料
  • 优质书籍:进阶必读《Vue.js 设计与实现》
  • 开源项目:vitesse、vue3-element-admin 等
  • 社区博客:稀土掘金、知乎、Discord
  • 视频课程:Bilibili 免费资源 + 慕课网系统课程

学习是一个持续的过程。希望这些资源能陪伴你走完 Vue 的学习之路,甚至走得更远。加油!


全书总结

恭喜你读完了这本 Vue 3 完全指南!从环境安装到响应式原理,从组件化开发到 Pinia 状态管理,从 TypeScript 到性能优化,从工程化到源码导读——我们几乎覆盖了 Vue 3 开发的所有重要知识点。

记住这些核心原则

  1. 响应式是灵魂——理解 Proxy 和依赖收集,你就理解了 Vue 的一半
  2. 组件化是核心——把 UI 拆成组件,把逻辑抽成 Composables
  3. TypeScript 是标配——Vue 3 对 TS 的支持已经非常完善
  4. 工程化是保障——ESLint、Prettier、Git、CI/CD 是高质量团队的标配
  5. 实践出真知——看十遍不如动手做一遍

Vue 3 是一个还在快速发展的框架。Nuxt 3、Vapor Mode、新的编译器优化……未来还会有更多新东西等待你去探索。保持好奇,持续学习,你一定能成为优秀的 Vue 开发者!

祝你在 Vue 的世界里玩得开心! 🚀