typescript - Ne mogu pronaći modul koji je definiran u tsconfig `paths`

Pokušavam postaviti alias-e za svoj mock server. Kad god pokušam kompajlirati ts datoteke, vraća grešku da nije mogao pronaći odgovarajuće module iako su oni definirani u tsconfig.json->paths

Struktura mapa:

├── server
│   └── src
│       └──/json
├── src
│   └──/modules
├── tsconfig.json

Evo mog tsconfig.json

{
    "compilerOptions": {
        "baseUrl": "./src",
        "experimentalDecorators": true,
        "jsx": "react",
        "lib": [
            "dom",
            "es2015",
            "es2015.promise"
        ],
        "module": "commonjs",
        "moduleResolution": "node",
        "noImplicitAny": true,
        "noUnusedLocals": true,
        "esModuleInterop": true,
        "paths": {
            "@project/app/modules/*": [
                "modules/*"
            ],
            "@project/server/data/*": [
                "../server/src/json/*"
            ]
        },
        "sourceMap": true,
        "target": "es5"
    },
    "exclude": [
        "node_modules",
        "tools"
    ]
}

Greška: Greška: Ne mogu pronaći modul '@project/server/data/accounts/accountsList'

Odgovor #1

Pa, nakon nekoliko sati patnje, dobio sam rješenje, koristim paket ts-node i dobio sam istu pogrešku Error: Cannot find module ''@modules/logger''

Trebate dodati ts-node konfiguraciju u tsconfig.json datoteku. Više informacija možete dobiti na ts-node

Evo kako izgleda moja tsconfig.json datoteka

{
    "ts-node": {
        // Do not forget to `npm i -D tsconfig-paths`
        "require": ["tsconfig-paths/register"]
    },
    "compilerOptions": {
        "lib": ["es5", "es6", "es7"],
        "target": "es2017",
        "module": "commonjs",
        "moduleResolution": "node",
        "rootDir": "src",
        "outDir": "build",
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "esModuleInterop": true,
        "noImplicitAny": true,
        "strict": true,
        "resolveJsonModule": true,
        "allowJs": true,
        "sourceMap": true,

        "baseUrl": ".",
        "paths": {
            "@modules/*": ["src/modules/*"],
            "*": ["node_modules/*"]
        },

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

i ovdje je moj package.json

"_moduleAliases": {
        "@modules": "build/modules",
        "@core": "build/core"
    }

Trebate instalirati ovaj paket kao ovisnost modula alias npm i module-alias

I ne zaboravite dodati import 'module-alias/register'; u ulaznu datoteku aplikacije kao ovisnost modulskog aliasa.

Odgovor #2

Nakon što sam se neko vrijeme s time borio, shvatio sam da morate uključiti sve direktorije koristeći tsconfig-paths u vašem glavnom tsconfig.json datoteci. Radna verzija vaše tsconfig.json datoteke mogla bi biti

{
    "compilerOptions": {
        "baseUrl": ".",
...
        "paths": {
            "@project/app/modules/*": [
                "src/modules/*"
            ],
            "@project/server/data/*": [
                "server/src/json/*"
            ]
        },
    },

    "include": [
        "./src",
        "./server"
    ],
}

Odgovor #3

Suočio sam se s istim problemom. Pokušao sam mnogo stvari i sada imam rješenje koje meni funkcionira. Imam aplikaciju i biblioteku u svom Angular projektu. Želim koristiti alias biblioteke u svojoj aplikaciji.

Imam sljedeću strukturu:

├── projects
│   └── lib
│       └── src
│           └── lib
│               └── lib-service.ts
│           └── index.ts
│   └── app
│       └──tsconfig.app.json
├── tsconfig.json

U datoteci tsconfig.json u glavnoj mapi imam definirane sljedeće putove:

"paths": {
  "my-lib": [
    "projects/lib/src/index.ts"
  ]
}

Tamo pristupam datoteci index.ts gdje definiram stvari koje želim izvesti. U mom slučaju datoteka index.ts ima sljedeći unos:

export * from './lib/lib-service';

Sada mogu pristupiti LibService u komponentama aplikacije uz pomoć aliasa:

import {LibService} from 'my-lib';

Važno je spomenuti da ovo rješenje ne funkcionira ako dodam ovaj unos u datoteku tsconfig.app.json. Mislim da IDE (u mom slučaju WebStorm) traži alias-e u datoteci tsconfig.json koja je blizu korijenskog direktorija. Tako da proširujem tsconfig.json u svom tsconfig.app.json.

"extends": "../../tsconfig",

Možda ćete morati ponovno pokrenuti svoj IDE kako biste uklonili crvenu crtu ispod retka za import.

Nadam se da ovo rješenje radi za vas. Morate napraviti još malo posla oko postavljanja jer morate definirati klase koje želite izvesti u datoteci index.ts. Ali u slučaju korištenja biblioteka to ima smisla jer ne želite da sve bude vidljivo za drugu aplikaciju.

Odgovor #4

Moj problem je bio što je moj tsconfig.app.json koji je nasljeđivao moj tsconfig.json pogrešno nadjačavao opciju "baseUrl". Uklonio sam je iz tsconfig.app.json tako da nije imao "baseUrl" niti "paths". Na kraju, moj tsconfig.json imao je sljedeće opcije kompajlera:

"baseUrl": "src/",
"paths": {
    "@shared/*": ["shared/*"],
    "@client/*": ["client/*"],
    "@server/*": ["server/*"]
}

Odgovor #5

Sljedeći tsconfig.json je kod mene radio, omogućavajući import {{ foo }} from '@models' itd. za pripadajuće index.ts barrel exporte:

{
    "baseUrl": "./",
    "paths": {
      "@environment": ["./src/environments/environment.ts"],
      "@models": ["./src/app/shared/models/index.ts"],
      "@services": ["./src/app/shared/services/index.ts"]
    },
}

Povezani članci