为现有 Strapi 项目添加 TypeScript 支持

页面摘要： 通过创建带有 allowJs: true 的根目录和 admin tsconfig.json 文件（用于渐进式迁移），然后重新构建管理面板，为现有 Strapi 项目添加 TypeScript 支持。

为现有项目添加 TypeScript 支持需要添加 2 个 tsconfig.json 文件并重新构建管理面板。此外，还可以选择性地移除 eslintrc 和 eslintignore 文件。

应在根 tsconfig.json 文件中将 TypeScript 标志 allowJs 设为 true，以便向现有 JavaScript 项目渐进式地添加 TypeScript 文件。allowJs 标志允许 .ts 和 .tsx 文件与 JavaScript 文件共存。

可以使用以下流程为现有 Strapi 项目添加 TypeScript 支持：

1. 在项目根目录添加一个 tsconfig.json 文件，并将以下带 allowJs 标志的代码复制到该文件中：

{
    "extends": "@strapi/typescript-utils/tsconfigs/server",
    "compilerOptions": {
      "outDir": "dist",
      "rootDir": ".",
      "allowJs": true //enables the build without .ts files
    },
    "include": [
      "./",
      "src/**/*.json"
    ],
    "exclude": [
      "node_modules/",
      "build/",
      "dist/",
      ".cache/",
      ".tmp/",
      "src/admin/",
      "**/*.test.ts",
      "src/plugins/**"
    ]
  
  }
  

2. 在 ./src/admin/ 目录中添加一个 tsconfig.json 文件，并将以下代码复制到该文件中：

{
    "extends": "@strapi/typescript-utils/tsconfigs/admin",
    "include": [
      "../plugins/**/admin/src/**/*",
      "./"
    ],
    "exclude": [
      "node_modules/",
      "build/",
      "dist/",
      "**/*.test.ts"
    ]
  }
  

3. (可选) 从项目根目录删除 .eslintrc 和 .eslintignore 文件。
4. 在 database.ts 配置文件中，为 filename 属性额外添加一个 '..'（仅在使用 SQLite 数据库时需要）：

const path = require('path');

module.exports = ({ env }) => ({
  connection: {
    client: 'sqlite',
    connection: {
      filename: path.join(
        __dirname,
        "..",
        "..",
        env("DATABASE_FILENAME", ".tmp/data.db")
      ),
    },
    useNullAsDefault: true,
  },
});

5. 重新构建管理面板并启动开发服务器：

Yarn

```sh
yarn build
yarn develop
```

NPM

npm run build
npm run develop

项目根目录会新增一个 dist 目录（参见项目结构），并且该项目将拥有与新建的 TypeScript 支持型 Strapi 项目相同的 TypeScript 功能。