我有一个配置文件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>;
}
然而,它似乎不起作用,因为我可以添加任意字段到我的json.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
本身具有强类型:
3条答案
按热度按时间uxhixvfz1#
tsconfig.json
文件中提供的“强类型”实际上根本不是TypeScript的工作!相反,VSCode使用内置的JSONSchema集成来为json文件提供类型提示。https://code.visualstudio.com/docs/languages/json
许多开源库都为它们提供了JSON模式,例如:webpack、eslint等。(https://schemastore.azurewebsites.net/json/)
ktca8awb2#
Typescript不会验证你的json。它只适用于
.ts
和.tsx
文件。你的
d.ts
会做的是假设从config.json
导入的数据符合你的类型,但它实际上不会确保这一点,因为json文件在typescript的域之外。解决方法是将此配置放在
config.ts
文件中,而不是像这样:w41d8nur3#
我解决了一个类似的问题,没有使用普通的json文件作为配置,而是通过动态导入一个config module:
script_with_config.ts:
然后在我的配置文件中使用导出的配置类型
myConfigFile.ts:
请注意,配置不仅适用于
loadedConfigs["default"]
,也适用于loadedConfigs["someConfig"]
(因为它也是通过这种方式导出的)。因此,您可以在一个文件中导出多个bar,就像在本例中,您可以使用loadedConfigs["someOtherConfig"]
访问其他配置,它会将“bar”记录到控制台。当然,您必须同时编译配置文件,或者(像我一样)使用ts-node来执行脚本。