javascript - Typescript compiler fejl ved import af json-fil

Så koden er simpel:

opkald.json

{"SERVER":{
    "requests":{
      "one":"1"
    }
} }

fil.ts

import json = require('../static/calls.json');
console.log(json.SERVER);

Den genererede JavaScript er korrekt, og når Node.js-serveren kører, udskriver konsol-loggen json.SERVER '{ requests: { one: '1' } }', som den skal.

Typescript-kompilatoren (commonjs) kan dog på en eller anden måde ikke lide denne situation og kaster: "Kan ikke finde modulet '../static/calls.json'".

Selvfølgelig prøvede jeg at skrive en .d.ts fil, sådan her:

declare module '../static/calls.json'{
    var exp:any;
    export = exp;
}

dette kaster så åbenbart: "Ambient moduldeklaration kan ikke angive relativt modulnavn".

Jeg prøvede også forskellige varianter, som:

declare module 'calls.json' {
    import * as json from '/private/static/calls.json';
    export = json;
}

og derefter krævende:

import json = require('calls.json');

Ingen fungerer ordentligt og har deres egne små compilationsfejl :)

Jeg vil bruge en ekstern .json-fil, fordi jeg bruger commonjs på serversiden og amd på klientsiden, og jeg vil have en enkelt fil til at indlæse konstanter.

Svar #1

Brug var i stedet for import.

var json = require('./calls.json');

Du indlæser en JSON-fil, ikke et modul, så import bør ikke bruges i dette tilfælde. Når var bruges, behandles require() igen som en normal funktion.

Hvis du bruger en Node.js-definition, bør alt bare fungere, ellers skal require defineres.

Svar #2

TS 2.9 tilføjede støtte for korrekt typede JSON-importer. Tilføj blot:

{
  "compilerOptions": {
    "resolveJsonModule": true
  }
}

i din tsconfig.json eller jsconfig.json. Nu importer såsom:

import json = require('../static/calls.json');

og

import * as json from '../static/calls.json';

bør blive løst og have korrekte typninger også!

Svar #3

En anden løsning er at ændre data.json til data.ts og eksportere sådan her

export default {
  "key" : {
    ...
  }
}

og importér som du ville forvente:

import { default as data } from './data'

Svar #4

Dette kan også gøres ved at bruge import-sætningen, hvis man bruger webpack v2, som allerede er pakket med json-loader.

Bemærk, at dette ikke er asynkront

import data from './data.json';//Note that this is not async

Tilføj også i din typings.d.ts-fil følgende wildcard-modul for at undgå TypeScript-fejlen, der siger: Kan ikke finde modul

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

For alle, der er interesserede i async-imports, tjek denne artikel af 2uality

Relaterede artikler