VSCode typescript importering av JSON-fil uthevingsproblem

Jeg opplever en merkelig oppførsel når jeg importerer JSON-filer ved bruk av import-setningen i TypeScript mens jeg bruker VSCode. Merk at dette ikke er et problem med TypeScript i seg selv, bare VSCode-markeringen.

Jeg har redigert min tsconfig.json ved å legge til resolveJsonModule og esModuleInterop med verdien true i mine kompilatoralternativer for å aktivere import av json i TypeScript.

Jeg har også lagt til denne pakken i prosjektet mitt https://www.npmjs.com/package/json-d-ts og lagt til et typeRoots-attributt i tsconfig.json med verdien ["node_modules/json-d-ts"]

Jeg har importert json-filen (funnet på src/config/firebaseServiceKey.json) innenfor en modul (funnet på src/firebaseApp.ts) som ligger i en overordnet katalog, dermed ser importen slik ut:

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

VSCode klager ikke på denne importen:

Men jeg har et annet modul som importerer den samme filen på et annet nivå i prosjektmappen, dette moduset finnes på test/utils.ts, importen ser slik ut:

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

Denne gangen ser det ut til at VSCode ikke liker den relative importen og markerer modulen som manglende:

Noen ideer om hvordan man kan konfigurere VSCode for å fikse dette problemet?

Her er den relevante delen av resultatet av å kjøre 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'. ========

Her er min 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"
  ]
}

Svar #1

Jeg har stått overfor lignende problemer, sjekk at filen din er inkludert som @Matt McCutchen sa, filen som inneholder import serviceKey from "../src/config/firebaseServiceKey.json"; bør være inkludert under src-mappen som du beskrev i tsconfig.json

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

I mitt tilfelle var det en testfil som ikke skulle inkluderes i bygget. På grunn av det har jeg bestemt meg for å ignorere den markeringen i vs.

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

Relaterte artikler