Vue.js 开发环境
在正式开始开发 Vue 应用之前，你需要配置好本地开发环境。本节将带你了解 Vue 开发所需的基础工具，并介绍如何通过官方推荐的方式快速搭建 Vue 3 项目开发环境。你将学会使用 Node.js、包管理器（如 npm 或 pnpm）、Vue 官方工具（如 create-vue 和 Vite）进行项目初始化。
准备工作
在开始之前，请确保你的电脑中安装了以下工具：
安装 Node.js
Vue 3 需要依赖 Node.js 运行环境，建议安装 Node.js 16.0 或更高版本。你可以访问 Node.js 官网 下载安装包，具体下载和安装步骤可参考《Node.js 安装》。如果你的系统安装了多个 Node.js 版本，推荐使用 NVM 工具进行管理。
安装完成后，在终端中运行以下命令，确认是否安装成功：
node -v
npm -v
你应该能看到 Node.js 和 npm 的版本号。
选择包管理器
Node.js 默认包含了 npm，但你也可以选择其他更高效的包管理器，比如：
以安装 pnpm 为例：
npm install -g pnpm
创建 Vue 项目
Vue 官方推荐使用 create-vue 脚手架工具来创建 Vue 3 项目，底层使用了 Vite 构建工具。
使用 npm 创建项目
npm create vue@latest
或者使用 pnpm：
pnpm create vue@latest
执行命令后，终端会提示你输入项目名称，并选择配置项：
- 是否使用 TypeScript？
- 是否添加 Vue Router？
- 是否添加 Pinia（状态管理）？
- 是否使用 ESLint、Prettier 等工具？
你可以根据自己的需求自由选择。如果你只是想快速开始，可以全部选择默认项。
启动开发服务 器
创建项目成功后，进入项目目录并启动开发服务器：
cd my-vue-app
pnpm install
pnpm dev
默认情况下，开发服务器会运行在 http://localhost:5173/，打开浏览器即可看到 Vue 应用的欢迎页面。
VS Code：推荐的开发工具
虽然你可以使用任何代码编辑器开发 Vue 项目，但我们强烈推荐你使用 Visual Studio Code，并安装以下插件：
- Volar：Vue 3 的官方语法支持插件，支持 TypeScript。
- TypeScript Vue Plugin (Volar)：增强 Volar 的类型支持。
- Prettier 或 ESLint：用于代码格式化和规范检查。
小结
本节你学习了如何配置 Vue.js 的开发环境，包括安装 Node.js、选择包管理器、使用官方工具创建项目，并启动开发服务器。推荐使用 VS Code 搭配 Volar 插件提升开发体验。下一节你将编写第一个 Vue 组件，正式进入开发实战阶段！
