2015-10-05 12 views
28

Quindi il codice è semplice:errore del compilatore tipografico durante l'importazione di file JSON

calls.json

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

file.ts

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

il JavaScript generato sia corretto e quando si esegue il nodo js server, il log della console json.SERVER stampa '{richieste: {uno:' 1 '}}', come dovrebbe.

Il compilatore typescript (commonjs) tuttavia, in qualche modo non ama particolarmente questa situazione e genera: "Impossibile trovare il modulo '../static/calls.json'".

Naturalmente ho provato a scrivere un file .d.ts, in questo modo:

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

questo poi, ovviamente, getta: "dichiarazione del modulo ambiente non può specificare relativo nome del modulo".

Ho anche provato diverse varianti, come:

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

e quindi richiede:

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

Nessuno lavoro correttamente e hanno i propri errori di compilazione piccoli :)

voglio usare un file .json esterno perché uso commonjs serveride e amd clientide e voglio un singolo file per caricare le costanti.

risposta

44

Utilizzare var anziché import.

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

si sta caricando un file JSON, non un modulo, in modo import non dovrebbe essere usato è questo caso. Quando viene utilizzato var, require() viene trattato di nuovo come una normale funzione.

Se si utilizza una definizione Node.js, tutto dovrebbe funzionare, altrimenti sarà necessario definire require.

+0

Questo funzionerebbe, anche se sto usando requirejs clientide. Questo significa che quando si carica la definizione requirejs, la variabile dichiarata richiede nella definizione del nodo causa problemi poiché una richiesta var è stata dichiarata anche in require.d.ts ... – Ken

+1

Yup, che è previsto quando entrambe le definizioni vengono referenziate contemporaneamente. Ciò avverrebbe anche in fase di runtime. Non useresti mai entrambi 'require' allo stesso tempo. La soluzione rapida è quella di avere quel file che non fa riferimento a nessuno di essi e basta usare 'declare var require: any;'. – thoughtrepo

+0

buone risposte, preparerò una soluzione ... – Ken

12

Questo può anche essere fatto utilizzando import dichiarazione se si utilizza webpack v2 che è già ricco di json-loader.

Si noti che questo non è asincrona

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

Inoltre, nella vostra typings.d.ts aggiungere il seguente wildcard module per evitare errori dattiloscritto dicendo: Cannot find module

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

Per chiunque sia interessato a async importazioni, controllare this article by 2uality

10

Un'altra soluzione è quella di cambiare data.json-data.ts ed esportare come questo

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

e importa come ci si aspetterebbe:

import * as data from './data.ts' 
+4

importazione {default come dati} da './data.ts'; –

Problemi correlati