Vue 3 + TypeScript 项目中使用 Mock.js

注意：Mock.js 仅在前端环境中模拟数据，不会替代后端真实接口。在项目上线或与后端对接时，需要将 Mock.js 相关的代码移除或替换为真实的后端接口。

1.安装 Mock.js:

在项目的根目录下打开终端或命令行工具，执行以下命令中的一个来安装 Mock.js 包：

2.创建 Mock 数据文件:

在src文件夹下创建一个名为 mock 的文件夹，并在该文件夹中创建一个 mock-data.ts 文件。在 mock-data.ts 文件中编写用于生成随机数据的 Mock.js 代码。例如，你可以编写一个生成用户数据的示例代码：

3.全局注册 Mock 数据:

在入口文件main.ts中引入并启用 Mock 数据。加入下面的代码：

注意：在生产环境下，最好不要加载 Mock 数据，因此我们使用 process.env.NODE_ENV === 'development' 来判断是否处于开发环境。

4.使用 Mock 数据：

在组件、API 请求等，可以直接导入并使用 Mock 数据。例如在一个 HelloWorld 组件中使用上面示例中的 mockUsers 数据：

这样，在开发环境下，你的项目就会使用 Mock 数据生成随机的用户列表来展示。