Ant Design Pro 站点项目教程

项目的目录结构及介绍

Ant Design Pro 站点项目的目录结构如下：

ant-design-pro-site/
├── blog/
├── docs/
├── public/
├── src/
│   └── locales/
├── .editorconfig
├── .eslintignore
├── .eslintrc.js
├── .gitignore
├── .prettierignore
├── .prettierrc
├── formatMenu.js
├── LICENSE
├── README.md
├── package.json
├── tsconfig.json
├── typings.d.ts
├── umirc.js
└── github/
    └── workflows/

目录介绍

• blog/: 存放博客相关文件。
• docs/: 存放文档相关文件。
• public/: 存放公共资源文件。
• src/: 存放源代码文件，其中 locales/ 目录用于存放多语言文件。
• github/workflows/: 存放 GitHub Actions 的工作流配置文件。
• .editorconfig: 编辑器配置文件。
• .eslintignore: ESLint 忽略文件配置。
• .eslintrc.js: ESLint 配置文件。
• .gitignore: Git 忽略文件配置。
• .prettierignore: Prettier 忽略文件配置。
• .prettierrc: Prettier 配置文件。
• formatMenu.js: 菜单格式化脚本。
• LICENSE: 项目许可证文件。
• README.md: 项目说明文件。
• package.json: 项目依赖和脚本配置文件。
• tsconfig.json: TypeScript 配置文件。
• typings.d.ts: TypeScript 类型定义文件。
• umirc.js: 项目配置文件。

项目的启动文件介绍

项目的启动文件主要是 package.json 中的 start 脚本。具体命令如下：

"scripts": {
  "start": "npm run site:start"
}

执行 npm start 命令后，项目会在本地启动，默认访问地址为 http://localhost:8000。

项目的配置文件介绍

umirc.js

umirc.js 是项目的配置文件，包含了项目的各种配置选项，例如路由配置、插件配置等。

export default {
  plugins: [
    // 插件配置
  ],
  routes: [
    // 路由配置
  ],
  // 其他配置
};

package.json

package.json 文件包含了项目的依赖、脚本和其他元数据。

{
  "name": "ant-design-pro-site",
  "version": "1.0.0",
  "scripts": {
    "start": "npm run site:start",
    "build": "npm run site:build",
    "deploy": "npm run site:deploy"
  },
  "dependencies": {
    // 依赖包
  },
  "devDependencies": {
    // 开发依赖包
  }
}

tsconfig.json

tsconfig.json 文件是 TypeScript 的配置文件，用于配置 TypeScript 编译选项。

{
  "compilerOptions": {
    "target": "esnext",
    "module": "commonjs",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "forceConsistentCasingInFileNames": true
  }
}

通过以上配置文件，可以对项目进行详细的配置和管理。