轻笑Chuckle
·
Vite、Pinia、Router
💡
原文中文，约4200字，阅读约需10分钟。
📝
内容提要
本文介绍了Vite和Pinia两个前端开发工具，Vite是一种新型的前端构建工具，提供快速反应速度，Pinia是类似于Vuex的状态管理库，具有更好的类型安全性和更简单的API。文章详细介绍了Vite的使用方法和Pinia的特点，包括创建项目、配置路由和路由守卫，以及使用Pinia创建和操作状态的方法。
🎯
关键要点
- Vite是一种新型的前端构建工具，提供快速反应速度。
- Vite利用浏览器原生ES模块导入功能，替代传统打包方式。
- 创建Vite项目的命令为npm create vite@latest。
- 项目结构与vue-cli相似，index.html位于项目根目录。
- 使用vue-router进行路由配置，安装命令为npm i vue-router。
- 路由守卫接收两个参数to和from，不再使用next()。
- 全局路由守卫可以控制用户导航，基于认证状态进行跳转。
- Pinia是类似于Vuex的状态管理库，具有更好的类型安全性和更简单的API。
- 使用defineStore()创建store，允许创建多个store。
- 在组件中使用store时，需要使用storeToRefs()保持响应式。
➡️
