Angular 12 импортирует json в ts

Question

У меня есть файл json в src/assets/version.json с этим содержанием:

      {"VERSION":"1.0.0"}

и я импортирую файл в *.ts, например:

      import * as VersionInfo from 'src/assets/version.json';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.scss']
})
export class AppComponent {

 constructor() {
   console.log(`version ${VersionInfo['VERSION']}`);
 }

}

выход

      version 1.0.0

Это работает на Angular 11, но на Angular 12 CLI показывает ошибку

      Should not import the named export 'VERSION' (imported as 'VersionInfo') from default-exporting module (only default export is available soon)

это мой tsconfig.base.json

      {
  "compileOnSave": false,
  "compilerOptions": {
    "forceConsistentCasingInFileNames": true,
    "noFallthroughCasesInSwitch": true,
    "strictPropertyInitialization": false,
    "baseUrl": "./",
    "importHelpers": true,
    "outDir": "./dist/out-tsc",
    "sourceMap": true,
    "declaration": false,
    "module": "esnext",
    "moduleResolution": "node",
    "experimentalDecorators": true,
    "noImplicitAny": false,
    "target": "es2015",
    "resolveJsonModule": true,
    "typeRoots": [
      "node_modules/@types"
    ],
    "lib": [
      "es2018",
      "dom"
    ],
    "paths": {
      "jszip": [
        "node_modules/jszip/dist/jszip.min.js"
      ]
    }
  },
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictTemplates": true,
    "strictInjectionParameters": true
  },
}

Как исправить эту ошибку?

Answer 1

Следующее должно быть помещено в tsconfig.json

      {
 ...
 "compilerOptions": {
    ...
    "resolveJsonModule": true, //already there
    "esModuleInterop": true,
    ...
   },
...
"allowSyntheticDefaultImports": true
}

а затем просто импортируйте следующее в свой компонент

      import VersionInfo from 'src/assets/version.json';

Answer 2

import { default as VersionInfo } from 'src/assets/version.json';

Вам также понадобятся две упомянутые выше записи tsconfig.

Answer 3

Вы можете попробовать в tsconfig.json в виде:

      "compilerOptions": { "allowSyntheticDefaultImports":true }

И импорт:

      import VersionInfo from 'src/assets/version.json';

Answer 4

попробуй это :

      import VersionInfo from 'src/assets/version.json';