vite新建vue项目

### 使用 Vite 创建新的 Vue 项目

为了创建一个新的 Vue 项目并使用 Vite 工具，可以遵循一系列特定命令和操作来完成设置过程。

在终端输入 `npm create vite@latest` 启动项目的创建工作流程[^1]。当提示确认继续时，键入 `y` 来表示同意继续安装进程。随后会询问关于项目的几个细节：

- **Project name:** 输入希望赋予新项目的名称，比如这里命名为 `demo`。
- **Select a framework:** 此处应选择 `Vue` 框架用于构建应用程序。
- **Select a variant:** 如果偏好于传统的脚本语言，则可以选择 `JavaScript` 版本来初始化项目环境。

一旦上述配置完成后，通过执行 `cd demo && npm install` 进入到刚建立好的项目目录内并且安装依赖项。最后运行 `npm run dev` 命令启动本地开发服务器以便查看应用效果。

对于更复杂的场景，如需集成路由功能，可以在 `src` 文件夹下面分别新增名为 `router` 和 `views` 的两个子文件夹。其中 `router/index.js` 将用来定义路径映射逻辑；而 `views/index.vue` 则作为页面视图组件存在[^2]。

考虑到性能优化方面的需求，选用 Vite 构建工具能够显著提升前端工程化效率，因为它提供了极快的冷启动速度以及热更新机制支持，非常适合现代 Web 应用程序的快速迭代与发展[^3]。

# 安装Vite并创建Vue项目
npm create vite@latest
# 更改至项目根目录并安装依赖
cd demo && npm install
# 启动开发服务
npm run dev