resolveJsonModule 不能与 Angular 10 一起使用？答案

【问题标题】：resolveJsonModule not functioning with Angular 10?resolveJsonModule 不能与 Angular 10 一起使用？
【发布时间】：2020-10-30 12:57:52
【问题描述】：

我在一个全新的 Angular 10 项目的资产文件夹中有一个基本的 JSON 文件。
角 CLI：10.0.1 节点：14.5.0 操作系统：win32 x64 TSC 版本 3.9.5。在我的 tsconfig.json 我有

  "compilerOptions": {
    "module": "commonjs",
    "resolveJsonModule": true,
    "esModuleInterop": true
  }

我已多次重启 vscode，并尝试从 vscode 终端、powershell 窗口和 bash 终端编译，都返回相同的消息：“考虑使用 '--resolveJsonModule' 导入带有 '.json' 扩展名的模块”。我尝试使用不同选项的多种组合进行编译。此时我想知道是否应该重新启动这个项目并简单地降级我的 Angular 版本？

【问题讨论】：

有同样的问题。你解决了吗？

标签： angular typescript angular10

【解决方案1】：

我在运行 Ionic 5 (Angular 12) 测试时遇到了同样的问题。解决了：

import * as SomeJsonObjectName from './assets/someObject.json

但只有在添加之后

"resolveJsonModule": true,

到tsconfig.json的compilerOptions

【讨论】：

在没有"esModuleInterop": true的情况下为我工作

【解决方案2】：

我发现 Melvin Gruschow 的问题（即使使用“resolveJsonModule”和“esModuleInterop”也会发生错误）的一种解决方案是在“app”目录中名为“json-typings.d.ts”的文件中声明 json 模块.这样：

declare module "*.json" {
    const value: any;
    export default value;
}

【讨论】：

【解决方案3】：

如果有人在 Angular 11 中有类似的东西：

我收到了这条额外的错误消息：

找不到模块“nameOfMyJsonFile.json”。考虑使用 '--resolveJsonModule' 导入扩展名为 '.json' 的模块。

所以我必须将 resolveJsonModule 添加到 compilerOptions 内的 "tsconfig.json" 文件中，而不是在 tsconfig.app.json 中。

 {
      "compileOnSave": false,
      "compilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist/out-tsc",
        "resolveJsonModule": true,
        "sourceMap": true,
        "declaration": false,
        "downlevelIteration": true,
        "experimentalDecorators": true,
        "moduleResolution": "node",
        "importHelpers": true,
        "target": "es2015",
        "module": "es2020",
        "lib": [
          "es2018",
          "dom"
        ]
      }
    }

【讨论】：

你知道这是代码编辑器的错误还是Angular本身的错误？在编译时，这似乎不是问题，只是被忽略了。
我不确定。我认为是 Angular 本身，因为我每次都使用相同的编辑器，那是我第一次遇到这样的错误。我确信这不仅仅是一个警告，因为如果我可以忽略它，我会的，但我不知何故来到了这里。
适用于 Angular 12。不是 IDE 抱怨，而是无法编译。

【解决方案4】：

在 Angular 版本 10 中，我们有 3 个“tsconfig”文件。

您必须在“compilerOptions”内的“tsconfig.app.json”文件中添加“resolveJsonModule”和“esModuleInterop”选项。

文件应如下所示：

{
  "extends": "./tsconfig.base.json",
  "compilerOptions": {
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "outDir": "./out-tsc/app",
    "types": []
  },
  "files": [
    "src/main.ts",
    "src/polyfills.ts"
  ],
  "include": [
    "src/**/*.d.ts"
  ]
}

【讨论】：