Ошибка компилятора Typescript при импорте файла json

Итак, код прост:

call.json

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

file.ts

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

сгенерированный javascript правильный, и при запуске js-сервера узла консольный журнал json.SERVER печатает '{requests: {one:' 1 '}}', как и должно быть.

Однако компилятор машинописного текста (commonjs) почему-то не особо любит эту ситуацию и выдает: «Не удается найти модуль '../static/calls.json'».

Конечно, я пробовал написать файл .d.ts, например:

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

это тогда, очевидно, выдает: «Объявление внешнего модуля не может указывать относительное имя модуля».

Я также пробовал разные варианты, например:

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

а затем требуя:

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

Ни один из них не работает должным образом и имеет свои небольшие ошибки компилятора :)

Я хочу использовать внешний файл .json, потому что я использую commonjs serveride и amd clientide, и мне нужен один файл для загрузки констант.


person Ken    schedule 05.10.2015    source источник


Ответы (7)


Используйте var вместо import.

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

Вы загружаете файл JSON, а не модуль, поэтому import не следует использовать в этом случае. Когда используется var, require() снова обрабатывается как нормальная функция.

Если вы используете определение Node.js, все должно работать, иначе нужно будет определить require.

person thoughtrepo    schedule 05.10.2015
comment
Это сработает, хотя я использую клиентскую часть requirejs. Это означает, что при загрузке определения requirejs объявленный var require в определении узла вызывает проблемы, потому что var require также был объявлен в require.d.ts ... - person Ken; 05.10.2015
comment
Ага, этого и следовало ожидать, когда упоминаются оба определения одновременно. То же самое и во время выполнения. Вы бы никогда не использовали оба require одновременно. Быстрое решение - сделать так, чтобы этот файл не ссылался ни на один из них, а просто использовал declare var require: any;. - person thoughtrepo; 05.10.2015
comment
@ thinktrepo Не могли бы уточнить свой ответ? Машинопись от Babel до ES5 все еще ищет модуль. Я нахожусь в такой ситуации, и хотя интуиция безотказной работы заключалась бы в том, чтобы импортировать json как var config = require('./config.json'), Typescript-Babel по-прежнему указывает то же сообщение об ошибке «не удается найти модуль .config.json». - person nunobaba; 06.04.2016
comment
Я получил сообщение об ошибке Failed to lint :: require statement not part of an import statement. Может кто-нибудь помочь? - person Anthony; 04.07.2019
comment
ts не допускает var. - person pete; 01.08.2020

TS 2.9 добавлена ​​поддержка для скважины набранный импорт json. Просто добавь:

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

в вашем tsconfig.json или jsconfig.json. Теперь импорт такой как:

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

а также

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

должны быть разрешены и иметь правильную типизацию!

person Matt Bierner    schedule 05.06.2018
comment
Не работает, посмотрите эту проблему с github - person Max; 09.07.2018
comment
@Max у меня работает. Исправление было добавлено в мастер 5 июля и теперь доступно в стабильной версии. - person Mihail Malostanidis; 13.08.2018
comment
это работает, только если ваша цель commonjs, если вы хотите вывести что-нибудь еще, это не сработает - person mlg87; 14.08.2018
comment
Отлично работает независимо от цели. Мне и многим другим пришлось перезапустить VS Code < / b>, чтобы Intellisense перестал лаять. - person Josh Habdas; 23.06.2020

Другое решение - изменить data.json на data.ts и экспортировать, как это

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

и импортируйте, как и следовало ожидать:

import { default as data } from './data'
person kenju    schedule 12.05.2017
comment
импортировать {по умолчанию как данные} из './data.ts'; - person Expert wanna be; 14.09.2017
comment
@phi не уверен, что требуется расширение .ts. - person RtmY; 16.05.2018

Это можно также сделать с помощью оператора import при использовании webpack v2, который уже упакован с помощью json-loader.

Обратите внимание, что это не асинхронный

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

Кроме того, в свой typings.d.ts файл добавьте следующий модуль подстановочных знаков, чтобы избежать ошибки машинописного текста, говорящей: Cannot find module

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

Для всех, кто интересуется async импортом, ознакомьтесь с этой статьей от 2uality

person sabithpocker    schedule 07.05.2017

Начиная с Typescript 2.9 вы можете импортировать файл JSON изначально без какого-либо дополнительного взлома / загрузчика.

Следующий отрывок скопирован из указанной выше ссылки.

... TypeScript теперь может импортировать файлы JSON в качестве входных файлов при использовании стратегии узлов для moduleResolution. Это означает, что вы можете использовать файлы json как часть своего проекта, и они будут хорошо типизированы!

./src/settings.json

{
    "dry": false,
    "debug": 

./src/foo.ts

import settings from "./settings.json";

settings.debug === true;  // Okay
settings.dry === 2;       // Error! Can't compare a `boolean` and `number`
person doomleika    schedule 06.06.2018

Год, 2021. Я хотел импортировать версию package.json

Для пользователей Angular, если вы застряли. Хотите использовать импорт?

откройте tsconfig.json и добавьте ключ compilerOptions

"resolveJsonModule": true,

Вот и все, что вы можете использовать

import { version } from '../package.json';
person minigeek    schedule 06.05.2021

person    schedule
comment
требуется ненужный HTTP-запрос - person Edward Olamisan; 13.11.2018