typescript - Visual Studio Code klarer ikke å løse Angulars tsconfig-stier

Jeg prøver å importere noen tjenester ved å bruke barrels og tsconfigs paths-alternativer, men jeg får ikke Angular og VSCode til å samarbeide.

Hvis det fungerer for den ene, fungerer det ikke for den andre, og omvendt...

Min situasjon ser ut til å være ganske enkel:

  • i src/app/services har jeg en tjeneste som er eksportert i en index.ts
  • min src/tsconfig.app.json er bare dette:
{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/app",
    "types": [],
    "baseUrl": ".",
    "paths": {
      "services": ["app/services"]
    }
  },
  "exclude": [
    "test.ts",
    "**/*.spec.ts"
  ],
}

og app-en min i Angular kompilerer uten problemer, men VSCode fortsetter å gi meg feil hver gang jeg prøver å importere tjenesten min fra 'services' og gir meg [ts] Kan ikke finne modul 'services'.

hvorfor?

Jeg bruker TypeScript 3.1.6 og i VSCode-innstillinger har jeg "typescript.tsdk": "C:/Users/myuser/AppData/Roaming/npm/node_modules/typescript/lib" (jeg prøvde også å la standardinnstillingen være, ingen endringer)

rediger:

Hvis jeg spesifiserer paths i ./tsconfig.json med start fra src, er vscode fornøyd, men Angular er det ikke.

hvis jeg spesifiserer paths i både tsconfig.json og src/tsconfig.app.json, er både vscode og angular fornøyde, men det virker som en altfor dum løsning for meg...

Svar #1

Jeg fant det ut, selv om jeg fortsatt tenker at det hele er absurd...

VsCode søker automatisk etter en tsconfig.json-fil, og det bryr seg ikke om tsconfig.app.json, så paths må spesifiseres i tsconfig.json.

Samtidig spesifiserer angular-cli-skjelettet en baseUrl-parameter i tsconfig.app.json som overstyrer den øvre.

Løsningen er å slette baseUrl-parameteren i tsconfig.app.json eller redigere verdien til "../"

(Som en personlig bemerkning, gitt at vscode i stor grad brukes til å bygge Angular-løsninger, tror jeg at det er noe som bør vurderes på nytt i angular-cli-skjelettet eller i hvordan vscode søker etter tsconfig-filer)

Svar #2

dette svaret fungerte for meg.

  1. Åpne Command Palette og velg TypeScript: velg TypeScript-versjon ...

  2. Velg for å bruke Arbeidsområdeversjon

Håper dette svaret løser problemet for andre som står overfor det samme problemet.

Svar #3

Jeg har slitt med dette problemet i lang tid og har prøvd omtrent alle løsninger på internett. Prosjektet ville kompilere, men VSCode ville ikke respektere "paths"-deklarasjonene i min tsconfig.json.

Det som til slutt løste det for meg, var å fjerne «include»- og «exclude»-seksjonene i tsconfig.json-filen min

Jeg er ikke sikker på hvilken av de to som var problemet, men å fjerne begge løste endelig mitt langvarige problem.

Svar #4

Det ser ut til at VSCode bare sjekker tsconfig.json direkte i mappen du har åpnet. Den sjekker ikke mapper over, som tsc gjør, og ser ikke på tsconfig.app.json. Så i noen tilfeller kan baseUrl mangle fordi VSCode rett og slett ikke har lest en tsconfig.json.

VSCode sin begrensning til en enkelt tsconfig.json på ett fast sted har eksistert en stund, og det ser ut til at det ikke er så enkelt å gjøre dette mer fleksibelt: https://github.com/microsoft/vscode/issues/12463 (bla til slutten)

Som nevnt ovenfor er dette irriterende i Angular-CLI-oppsett med flere underprosjekter hvor det kun finnes én tsconfig.json i arbeidsområdets rot. Åpenbart kan prosjektene ha forskjellige baseUrls i sine tsconfig.app.json som ikke kan samles i én enkelt tsconfig.json i roten.

Som en løsning har jeg i tillegg til det prosjektspesifikke baseUrl i tsconfig.app.json laget en ekstra minimal tsconfig.json for VSCode i src-mappen til et underprosjekt med "baseUrl":"." og åpnet VSCode derfra. Jeg har ikke testet dette grundig, men så langt ser både Angular-kompilering og VSCode intellisense ut til å fungere bra.

Relaterte artikler