目录
- 第一章、安装周边库
-
- 1.1）状态管理：Pinia
- 1.2）路由管理：Router
- [1.3）HTTP 客户端：Axios](#1.3）HTTP 客户端：Axios)
- [1.4）UI 组件库：Element](#1.4）UI 组件库：Element)
- 第二章、下载Vue插件并安装
-
- 2.1）安装开发者工具
-
- [2.1.1）浏览器Vue.js devtools下载插件](#2.1.1）浏览器Vue.js devtools下载插件)
- 2.1.2）安装插件
- 2.1.3）验证是否安装成功
友情提醒:
先看目录，了解文章结构，点击目录可跳转到文章指定位置。
第一章、安装周边库
1.1）状态管理：Pinia
安装：Pinia (npm install pinia)，流行的状态管理库，相比 Vuex 更轻量、更简单，API 设计更符合 Composition API 的风格
①执行以下命令
sql
npm install pinia②在 dependencies 字段中查找 pinia。
如果找到了 pinia 并且有版本号，说明 Pinia 已经成功安装。
1.2）路由管理：Router
安装：Vue Router (npm install vue-router)Vue 官方的路由管理器，用于构建单页面应用 (SPA)，实现页面间的导航和跳转。
①执行以下命令
sql
npm install vue-router②验证方法同pinia相同
1.3）HTTP 客户端：Axios
安装：Axios (npm install axios)一个基于 Promise 的 HTTP 客户端，用于发送 HTTP 请求，与后端 API 进行交互。 功能强大，支持拦截器、取消请求等高级特性。
①执行以下命令
sql
npm install axios②验证方法同pinia相同
1.4）UI 组件库：Element
安装：Element Plus (npm install element-plus)一套基于 Vue 3 的 UI 组件库，提供丰富的 PC 端组件，风格统一、美观易用。
①执行以下命令
sql
npm install element-plus②验证是否安装成功
第二章、下载Vue插件并安装
2.1）安装开发者工具
2.1.1）浏览器Vue.js devtools下载插件
Chrome浏览器安装Vue.js devtools插件
2、右上角搜索框搜索vue.js DevTools插件
3、在本地解压刚刚下载的插件，解压后如图：
4、打开谷歌浏览器--更多工具--拓展程序
注意：打开开发者模式
2.1.2）安装插件
将解压的文件拖入拓展程序页面安装
2.1.3）验证是否安装成功
安装后可以在谷歌商店看到已安装
访问vue网站时，点击F12，可进入调试界面
