Typescript 本地文件 class '找不到模块'

Question

Having the below folder structure

- api
  - routes
    - meeting.ts
- models
  - DynamoService.ts

tsconfig.json

{
  "compilerOptions": {
    "target": "ES2020",
    "module": "commonjs",
    "outDir": ".build",
    "strict": true,
    "baseUrl": "./",
    "typeRoots": ["node_modules/@types"],
    "types": ["node"],
    "esModuleInterop": true,
    "preserveConstEnums": true,
    "sourceMap": true,
    "allowJs": true,
    "moduleResolution": "node",
    "rootDir": "./",
    "removeComments": true,
    "noEmitOnError": true,
    "noUnusedLocals": true,
    "noImplicitReturns": true
  },
  "exclude": ["node_modules"]
}

DynamoService.ts

export class DynamoService {
...
}

meeting.ts

import { DynamoService } from 'models/DynamoService'

const dynamoService = new DynamoService()

// other Express stuff...

When testing this I receive the below runtime error

Error: Cannot find module 'models/DynamoService'

Before trying to move the functionality into a class module having some DynamoDB helper methods in meeting.ts was working just fine. Visual Studio Code doesn't complain about anything, no compile errors.

That should be a simple task but I seem to have trouble!

Answer 1

There are two approaches to solve this problem.

Relative reference

You could simply change the import line like this:

import { DynamoService } from '../../models/DynamoService'

Typescript path alias

Another convenient way is to leverage this nice TypeScript feature by configuring paths in tsconfig.json :

{
  "compilerOptions": {
    "baseUrl": "src",
    "paths": {
        "models/*": ["models/*"]
    },
}

See more in https://www.typescriptlang.org/tsconfig#paths or https://medium.com/slackernoon/use-typescript-aliases-to-clean-up-your-import-statements-7210b7ec2af1 .