完全按照官方教程来进行：https://cn.vuejs.org/guide/quick-start.html
快速上手
线上尝试
想要快速体验 Vue，你可以直接试试我们的演练场。
如果你更喜欢不用任何构建的原始 HTML，可以使用 JSFiddle 入门。
如果你已经比较熟悉 Node.js 和构建工具等概念，还可以直接在浏览器中打开 StackBlitz 来尝试完整的构建设置。
创建一个 Vue 应用
前提条件
- 熟悉命令行
- 已安装 18.3 或更高版本的 Node.js
在本节中，我们将介绍如何在本地搭建 Vue 单页应用。创建的项目将使用基于 Vite 的构建设置，并允许我们使用 Vue 的单文件组件 (SFC)。
确保你安装了最新版本的 Node.js，并且你的当前工作目录正是打算创建项目的目录。在命令行中运行以下命令 (不要带上 $ 符号)：
$ npm create vue@latest
这一指令将会安装并执行 create-vue，它是 Vue 官方的项目脚手架工具。你将会看到一些诸如 TypeScript 和测试支持之类的可选功能提示：
✔ Project name: … <your-project-name>
✔ Add TypeScript? … No / Yes
✔ Add JSX Support? … No / Yes
✔ Add Vue Router for Single Page Application development? … No / Yes
✔ Add Pinia for state management? … No / Yes
✔ Add Vitest for Unit testing? … No / Yes
✔ Add an End-to-End Testing Solution? … No / Cypress / Nightwatch / Playwright
✔ Add ESLint for code quality? … No / Yes
✔ Add Prettier for code formatting? … No / Yes
✔ Add Vue DevTools 7 extension for debugging? (experimental) … No / Yes
Scaffolding project in ./<your-project-name>...
Done.
如果不确定是否要开启某个功能，你可以直接按下回车键选择 No。在项目被创建后，通过以下步骤安装依赖并启动开发服务器：
$ cd <your-project-name>
$ npm install
$ npm run dev
你现在应该已经运行起来了你的第一个 Vue 项目！请注意，生成的项目中的示例组件使用的是组合式 API 和 <script setup>，而非选项式 API。下面是一些补充提示：
- 推荐的 IDE 配置是 Visual Studio Code + Vue - Official 扩展。如果使用其他编辑器，参考 IDE 支持章节。
- 更多工具细节，包括与后端框架的整合，我们会在工具链指南进行讨论。
- 要了解构建工具 Vite 更多背后的细节，请查看 Vite 文档。
- 如果你选择使用 TypeScript，请阅读 TypeScript 使用指南。
当你准备将应用发布到生产环境时，请运行：
$ npm run build
此命令会在 ./dist 文件夹中为你的应用创建一个生产环境的构建版本。关于将应用上线生产环境的更多内容，请阅读生产环境部署指南。
总结和补充
按照以下步骤创建并运行一个 Vue 项目：
- 安装
node.js； - 在父文件夹中，执行命令：
npm create vue@latest；这一步的目的是创建一个基于最新版本的vue项目； - 进入项目文件夹，执行命令：
npm install；这一步的目的是安装需要的依赖项； - 执行命令：
npm run dev；这一步的目的是启动一个本地服务器，可以进行项目预览；
执行完以上步骤后，会有以下提示：
VITE v6.0.5 ready in 636 ms
➜ Local: http://localhost:5173/
➜ Network: use --host to expose
➜ Vue DevTools: Open http://localhost:5173/devtools/ as a separate window
➜ Vue DevTools: Press Alt(⌥)+Shift(⇧)+D in App to toggle the Vue DevTools➜ press h + enter to show help
如上所述，在浏览器访问http://localhost:5173/ 即可预览刚才创建的项目了。
如图：
