TypeScript 中的强类型 JSON

读取大型 JSON 文件？ #42761

错误报告

restful-react

今天，我所在的一个 Slack 社区里有人问，如何在 TypeScript 中输入 JSON，具体来说，就是导入 JSON 然后输入。他们想知道，先将 JSON 转换为unknown一个已知类型，然后在使用时再转换为一个已知类型，这是否是一个好的方法。

解决方案并不复杂。我们需要稍微动手，深入研究一下我们项目的 TypeScript 编译器选项。

默认情况下，如果导入 JSON，TypeScript 会提示无法导入，并显示以下错误消息：

Cannot find module './data.json'. Consider using '--resolveJsonModule' to import module with '.json' extension.ts(2732)

所以 TypeScript 会告诉我们该做什么。添加这个--resolveJsonModule标志。如果我们运行的是 TypeScript CLI，这会很有帮助，但这不是我们要做的。我们需要做的是将这个resolveJsonModule键添加到 tsconfig.json 文件中的编译器选项中，并将其设置为true。

{
  "compilerOptions": {
    "resolveJsonModule": true,
    // more awesome compiler options
  }
}

完成后，您会注意到，如果您输入data.，我们就有完全输入的 JSON 数据。

这对于以类型化的方式使用数据非常有用，但是如果我们在项目的其他地方需要 JSON 类型怎么办？我们可以使用 为其创建一个类型typeof。

type PersonalInfo = typeof data;

您可以试用这个 CodeSandbox 并观察它的运行情况，享受其中的乐趣。