1. 前置要求
在开始配置 Vue 开发环境之前，需要确保以下工具已安装：
Node.js：Vue 的构建工具依赖 Node.js。
npm 或 yarn：Node.js 自带 npm 包管理工具，也可以选择安装 yarn。
安装 Node.js
前往 Node.js 官网 下载并安装 LTS 版本。
安装完成后，通过以下命令验证安装：
node -v
npm -v
2. 配置 npm 的国内镜像（加速下载）
国内访问 npm 的速度较慢，推荐将 npm 的下载源设置为淘宝镜像。
设置 npm 镜像
执行以下命令：
npm config set registry https://registry.npmmirror.com
验证配置是否成功：
npm config get registry
输出应为：
https://registry.npmmirror.com/
使用 nrm 工具快速切换镜像（可选）
nrm 是一个 npm 源管理工具，可以快速切换源。
安装 nrm
npm install -g nrm
查看可用源
nrm ls
示例输出：
npm ---------- https://registry.npmjs.org/yarn --------- https://registry.yarnpkg.com/npmmirror ---- https://registry.npmmirror.com/ (淘宝镜像)
切换到淘宝镜像
nrm use npmmirror
恢复默认源
nrm use npm
3. 全局安装 Vue CLI
Vue CLI 是 Vue.js 的官方脚手架工具，用于快速创建项目。
安装 Vue CLI
npm install -g /cli
验证安装
vue --version
若安装成功，将输出版本号。
4. 创建 Vue 项目
使用 Vue CLI 创建一个新的 Vue 项目。
创建项目
vue create my-vue-app
执行命令后：
如果选择默认配置，直接按回车。
如果需要自定义配置（如 TypeScript 支持、路由、状态管理等），可以手动选择。
进入项目目录
cd my-vue-app
启动开发服务器
npm run serve
启动成功后，在浏览器中打开 http://localhost:8080，即可看到默认的 Vue 应用页面。
5. 常用插件与工具
根据项目需求，可以安装以下工具：
Vue Router（路由管理）
npm install vue-router
Vuex 或 Pinia（状态管理）
安装 Vuex：
npm install vuex
安装 Pinia：
npm install pinia
Axios（HTTP 请求库）
npm install axios
ESLint（代码规范工具）
在创建项目时可以选择集成 ESLint，或者后续手动安装：
npm install eslint --save-dev
6. 配置 Vue 项目中的下载源（可选）
若使用 Vue CLI 创建项目时速度较慢，可设置 Vue CLI 使用的 npm 镜像。
设置 Vue CLI 的下载源
vue config set registry https://registry.npmmirror.com
验证：
vue config get registry
7. 总结
至此，你已经完成了 Vue 环境的安装和配置，并成功创建了一个新的 Vue 项目。接下来，你可以根据项目需求进行功能开发。如果遇到任何问题，随时可以参考官方文档或寻求社区支持。
官方文档链接：https://cn.vuejs.org
