Angular 8 和导入 Json

r3p*_*ica 19 json typescript angular

我已经阅读了一些文章,说明您现在可以从 type script 2.9 直接导入 json。所以我修改了我的tsconfig.json文件如下:

{
  "compileOnSave": false,
  "compilerOptions": {
    "baseUrl": "./",
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "downlevelIteration": true,
    "experimentalDecorators": true,
    "module": "esnext",
    "moduleResolution": "node",
    "importHelpers": true,
    "target": "es2015",
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ]
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  },
  "paths": {
    "@data/*": ["src/core/data/*"],
    "@models/*": ["src/core/models/*"],
    "@services/*": ["src/core/*"],
    "@environments/*": ["src/environments/*"]
  },
  "resolveJsonModule": true,
  "esModuleInterop": true,
  "allowSyntheticDefaultImports": true
}
Run Code Online (Sandbox Code Playgroud)

然后我像这样将 json 导入到我的组件中:

import particlesJson from '../../assets/particles.json';
Run Code Online (Sandbox Code Playgroud)

它运行良好,但我在控制台中收到错误消息:

src/app/profile/login.component.ts(3,27) 中的错误:错误 TS2732:找不到模块“../../assets/particles.json”。考虑使用“--resolveJsonModule”导入带有“.json”扩展名的模块

我怎样才能阻止该错误出现?

Lpp*_*Edd 47

"resolveJsonModule": true,
"esModuleInterop": true,
Run Code Online (Sandbox Code Playgroud)

根据文档,应该放在compilerOptionstsconfig.json
请参阅此处的示例。

  • 这对每个人都有效吗?如果它对我不起作用,...我怎么能理解问题是什么?我使用 Angular 10,即使重新启动“所有内容”后,我也无法从 '../../../package.json' 导入 { version }; 我遇到了同样的错误:考虑使用 '--resolveJsonModule' 导入带有 '.json' 扩展名的模块.ts(2732) (3认同)

小智 12

就我而言,旧的计算机科学方法有效,只需重新启动 Visual Studio Code。

  • 经过几个小时的调试,您的评论对我有所帮助。重新启动会重新加载 tsconfig 文件并帮助它工作。 (2认同)