VSCode машинописный импорт проблемы с подсветкой файлов JSON - PullRequest
Новая
       7

VSCode машинописный импорт проблемы с подсветкой файлов JSON

0 голосов
/ 12 сентября 2018

У меня странное поведение при импорте файлов json с помощью оператора import в машинописи при использовании VSCode. Обратите внимание, что проблема не в самой машинописи, а в выделении VSCode.

Я отредактировал свой tsconfig.json, добавив resolJsonModule и esModuleInterop со значением true для опций моего компилятора, чтобы включить импорт json в машинописный текст.

Также я добавил этот пакет в свой проект https://www.npmjs.com/package/json-d-ts и добавил атрибут typeRoots в tsconfig.json со значением ["node_modules / json-d-ts"]

Я импортировал файл json (находится в src / config / firebaseServiceKey.json) внутри модуля (находится в src / firebaseApp.ts), который находится в родительском каталоге, поэтому импорт выглядит следующим образом: 

import databaseUrl from "./config/firebaseDatabaseURL.json";

VSCode не жалуется на этот импорт:

Good import highlighting

Однако у меня есть другой модуль, который импортирует тот же файл на другом уровне в каталоге проекта, этот модуль находится по адресу test / utils.ts, его импорт выглядит так: 

import serviceKey from "../src/config/firebaseServiceKey.json";

На этот раз VSCode, похоже, не нравится относительный импорт и выделяет модуль как отсутствующий:

enter image description here

Есть идеи, как исправить конфигурацию VSCode для решения этой проблемы?

Вот соответствующий раздел результата выполнения tsc --traceResolution: 

======== Resolving module '../src/config/firebaseServiceKey.json' from '/home/jty/April2018/vs-server/test/utils.ts'. ========
Explicitly specified module resolution kind: 'NodeJs'.
Loading module as file / folder, candidate module location '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json', target file type 'TypeScript'.
File '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json.ts' does not exist.
File '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json.tsx' does not exist.
File '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json.d.ts' does not exist.
Directory '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json' does not exist, skipping all lookups in it.
Loading module as file / folder, candidate module location '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json', target file type 'JavaScript'.
File '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json.js' does not exist.
File '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json.jsx' does not exist.
Directory '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json' does not exist, skipping all lookups in it.
Loading module as file / folder, candidate module location '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json', target file type 'Json'.
File '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json' exist - use it as a name resolution result.
======== Module name '../src/config/firebaseServiceKey.json' was successfully resolved to '/home/jty/April2018/vs-server/src/config/firebaseServiceKey.json'. ========

Вот мой tsconfig.json 

{
"compilerOptions": {
    "module": "commonjs",
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "target": "es6",
    "noImplicitAny": true,
    "moduleResolution": "node",
    "sourceMap": true,
    "outDir": "dist",
    "baseUrl": ".",
    "paths": {
        "*": [
            "node_modules/*",
            "src/types/*"
        ]
    }
},
"include": [
    "src/**/*"
],
"typeRoots": [
    "node_modules/json-d-ts"
  ]
}

1 Ответ

0 голосов
/ 31 июля 2019

У меня возникла похожая проблема, проверьте, включен ли ваш файл, как сказал @Matt McCutchen, файл, который содержит import serviceKey from "../src/config/firebaseServiceKey.json"; должен быть включен в папку src, как вы описали в tsconfig.json

"include": [
    "src/**/*"
],

В моем случае это был тестовый файл, который не должен быть включен в сборку. Из-за этого я решил игнорировать этот основной момент в сравнении с 

// @ts-ignore
import packageJson from '../../../../package.json';
...