typescript - Hur tar man bort det mystiska "default"-fältet som lagts till i JSON?

Jag har följande jsondata.json-fil:

{
    "name": "John",
    "age": 30,
    "car": "ferrari"
}

I samma katalog har jag en TypeScript-fil main.ts där jag helt enkelt congole.log JSON från jsondata.json

import * as j from './jsondata.json';

console.log(j);

Resultatet är överraskande:

{
  name: 'John',
  age: 30,
  car: 'ferrari',
  default: { name: 'John', age: 30, car: 'ferrari' }
}

Vad är det där default-fältet? Varför dyker det upp, och hur kan jag bli av med det?

Som referens, detta är min tsconfig.json

{
  "compilerOptions": {
    "target": "es5",
    "module": "commonjs",
    "sourceMap": true,
    "outDir": "./out",
    "strict": true,
    "moduleResolution": "node",
    "esModuleInterop": true,
    "resolveJsonModule": true,
    "forceConsistentCasingInFileNames": true
  }
}

Svar #1

Jag provade några kombinationer av inställningarna och upptäckte att de två sista inställningarna är det önskade beteendet.

jsondata.json:

{
    "name": "John",
    "age": 30,
    "car": "ferrari2"
}

resolveJsonModule satt till true och ingen esModuleInterop och import utan * import orsakar fel.

main.ts:

import j from './jsondata.json';
console.log(j);

tsconfig.ts:

"resolveJsonModule": true,
// "esModuleInterop": true

resultat :

>

{ name: 'John', age: 30, car: 'ferrari2' }

Module ... can only be default-imported using the 'esModuleInterop' flag

Båda flaggorna är inställda på true och * import visar standard

main.ts:

import * as j from './jsondata.json';
console.log(j);

tsconfig.ts

"resolveJsonModule": true,
"esModuleInterop": true

resultat :

>

{
  name: 'John',
  age: 30,
  car: 'ferrari2',
  default: { name: 'John', age: 30, car: 'ferrari2' }
}

Båda flaggorna inställda på sant utan *-import visar inte standard

main.ts:

import j from './jsondata.json';
console.log(j);

tsconfig.ts:

"resolveJsonModule": true,
"esModuleInterop": true

resultat :

>

{ name: 'John', age: 30, car: 'ferrari2' }

resolveJsonModule satt till true och ingen esModuleInterop och *-import visar ingen default

main.ts:

import * as j from './jsondata.json';
console.log(j);

tsconfig.ts:

"resolveJsonModule": true,
// "esModuleInterop": true

resultat :

>

{ name: 'John', age: 30, car: 'ferrari2' }

Svar #2

Bara ifall någon fortfarande stöter på detta problem. Som nämnts här kan du importera "default"-exporten istället för "*"

import { default as j } from './jsondata.json';

Detta bör åtgärda problemet.

Relaterade artiklar