JsonModule이 Angular 10에서 작동하지 않음을 확인합니다.

JsonModule이 Angular 10에서 작동하지 않음을 확인합니다.

새로운 Angular 10 프로젝트의 자산 폴더에 기본 JSON 파일이 있습니다.
Angular CLI: 10.0.1 노드: 14.5.0 OS: win32 x64 TSC 버전 3.9.5.내 tsconfig.json에는

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

여러 번 vscode를 다시 시작했고, vscode 터미널, powershell 창 및 bash 터미널에서 컴파일을 시도했지만 모두 동일한 메시지를 반환했습니다. "'.json' 확장자를 가진 모듈을 가져오기 위해 '--resolveJsonModule'을 사용하는 것을 고려하십시오."저는 여러 가지 다른 옵션을 조합하여 컴파일해 보았습니다.이 시점에서 저는 이 프로젝트를 다시 시작하고 단순히 제 Angular 버전을 다운그레이드해야 하는지 궁금합니다.

Angular 버전 10에는 3개의 "tsconfig" 파일이 있습니다.

"resolveJsonModule" 및 "esModule"을 추가해야 합니다."compilerOptions"의 "tsconfig.app.json" 파일에 있는 Interop" 옵션.

파일의 모양은 다음과 같습니다.

{
  "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"
  ]
}

Angular 11에서 유사한 내용을 가진 사람이 있다면 다음과 같습니다.

다음과 같은 추가 오류 메시지를 받았습니다.

'nameOfMyJsonFile.json' 모듈을 찾을 수 없습니다.확장명이 '.json'인 모듈을 가져오려면 '--resolveJsonModule'을 사용하십시오.

그래서 나는 resolveJsonModule을 tsconfig.app.json이 아닌 컴파일러 Options 내의 "tsconfig.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"
        ]
      }
    }

Ionic 5 (Angular 12) 테스트를 실행하는 것과 같은 문제가 있었습니다.해결 방법:

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

하지만 추가한 후에야

"resolveJsonModule": true,

컴파일러에 tsconfig.json의 옵션

Melvin Grusshow의 문제에 대한 한 가지 해결책을 찾았습니다("resolveJsonModule" 및 "esModule"에서도 오류가 발생함).Interop")은 'app' 디렉터리에 있는 'json-typings.d.ts'라는 파일 내에서 json 모듈을 선언하는 것입니다.다음과 같은 경우:

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

언급URL : https://stackoverflow.com/questions/62823189/resolvejsonmodule-not-functioning-with-angular-10