json - 在 typescript 中为 JSON 文件添加类型定义

Question

我有一个配置文件 config.json 位于我的 typescript 项目中，我想为其添加强类型。

src/config.json

{
   "id": "some-id-string",
   "data": { 
     "somekey" : "some value"
  }
}

为了添加类型，我还向我的项目添加了一个 index.d.ts 文件:

src/index.d.ts

declare module 'config.json' {
  export const id: string;
  export const data: Record<string, string>;
}

但是它似乎不起作用，因为我可以将任意字段添加到我的 config.json 并且 typescript 很乐意让它们通过，即:

src/config.json

{
   "id": "some-id-string",
   "foo": "bar", // <-- typescript doesn't catch this
   "data": { 
     "somekey" : "some value"
  }
}

我使用带有 typescript 标志的 create-react-app 创建了这个项目，它产生了以下 tsconfig.json:

tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "lib": ["dom", "dom.iterable", "esnext"],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "isolatedModules": true,
    "noEmit": true,
    "jsx": "react"
  },
  "include": ["src"]
}

我想我在这里漏掉了一些小步骤，但我不确定，而且我找不到很多例子来说明这是如何完成的。

编辑:这似乎是可行的，因为 tsconfig.json 本身具有强类型:

Answer 1

tsconfig.json 文件中提供的“强类型”实际上根本不是 TypeScript 的工作!

相反，VSCode 使用内置的 JSONSchema 集成为 json 文件提供类型提示。 https://code.visualstudio.com/docs/languages/json

许多开源库为那里的配置提供 JSON 模式，例如:webpack、eslint 等。( https://schemastore.azurewebsites.net/json/ )