使用 Pnpm 和 Vite 构建 Vue 项目

Vite 官网：https://cn.vitejs.dev/

本地 Node 环境

首先，确保已经安装了 Node.js 和 npm。可以在命令行中运行 node -v 和 npm -v 来检查它们是否已经正确安装：

安装 Node.js 通常会自动附带安装 npm，所以你不需要单独安装 npm。只需确保 Node.js 版本符合要求即可。

安装 Pnpm 包管理工具

1. 在命令行中执行以下命令来安装 pnpm：

   npm install -g pnpm
   

   这将全局安装 pnpm。

2. 安装完成后，可以使用 pnpm 来代替 npm 进行包管理。例如，使用以下命令来安装项目依赖：

   pnpm install
   

   这将使用 pnpm 来安装项目所需的包，而不是使用默认的 npm。

使用 Vite 创建

确保 Node.js 版本和 Npm 版本符合 Vite 要求：

按照以下步骤使用 Vite 创建 Vue 项目：

1. 在命令行中执行以下命令创建一个 Vue 项目：

   pnpm create vite
   

2. 输入你想要命名的项目名称：

   

3. 使用箭头键上下移动光标到 Vue 上，并按下 Enter 键以进行选择 Vue 作为项目模板：

   

4. 使用箭头键上下移动光标到 TypeScript 上，按下 Enter 键确认：

   

5. 项目创建完成：

   

6. 进入到项目目录中：

   cd your-project-name
   

7. 安装项目依赖：

   pnpm install
   

   

8. 启动项目，此时，Vite 将会启动开发服务器，并监听你的文件更改：

   pnpm run dev
   

   

9. 在浏览器中访问 http://localhost:5173/ 来查看 Vue 应用程序：

   

10. Vue 项目构建完成，项目目录如下：