javascript - Monorepo with paths from Typescript is not working - Stack Overflow

admin管理员组

文章数量:1208155

I have monorepo (yarn workpaces) with following file structure:

├── client                (workspace @client)
│   ├── package.json
│   └── tsconfig.json     (extended tsconfig)
├── server                (workspace @server)
│   ├── getData.ts
│   ├── package.json
│   └── tsconfig.json     (extended tsconfig)
├── shared
│   └── sanitizeData.ts
├── package.json          (monorepo root)
└── tsconfig.json         (base tsconfig)

And I want to use function from shared/sanitizeData.ts in server/getData.ts

I tried to use paths from Typescript, it looks pretty straightforward according to docs, but I'm doing something wrong:

error TS2307: Cannot find module '@shared/sanitizeData'.

server/tsconfig.json:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "baseUrl": ".",
    "rootDir": "../",
    "outDir": "build",
    "paths": {
      "@shared/*": ["shared/*"]
    }
  }
}

server/getData.js:

import { sanitizeData } from "@shared/sanitizeData";

Could you help me please?

I have monorepo (yarn workpaces) with following file structure:

├── client                (workspace @client)
│   ├── package.json
│   └── tsconfig.json     (extended tsconfig)
├── server                (workspace @server)
│   ├── getData.ts
│   ├── package.json
│   └── tsconfig.json     (extended tsconfig)
├── shared
│   └── sanitizeData.ts
├── package.json          (monorepo root)
└── tsconfig.json         (base tsconfig)

And I want to use function from shared/sanitizeData.ts in server/getData.ts

I tried to use paths from Typescript, it looks pretty straightforward according to docs, but I'm doing something wrong:

error TS2307: Cannot find module '@shared/sanitizeData'.

server/tsconfig.json:

{
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "baseUrl": ".",
    "rootDir": "../",
    "outDir": "build",
    "paths": {
      "@shared/*": ["shared/*"]
    }
  }
}

server/getData.js:

import { sanitizeData } from "@shared/sanitizeData";

Could you help me please?

• javascript
• typescript
• tsconfig
• monorepo
• yarn-workspaces

Share Improve this question Follow asked Oct 25, 2019 at 8:18 J VJ V 76322 gold badges88 silver badges1212 bronze badges

Add a comment  | 

2 Answers 2

Sorted by: Reset to default 8

Paths are relative to baseUrl, so in your case you'd have to replace ["shared/*"] with ["../shared/*"]

Define the baseUrl only in the root tsconfig file, to prevent rebasing complexities. Then, references all paths from baseurl.

Remember: The paths property does not merge entries from multiple tsconfig files... as the "extends" argument implies. Paths of a base tsconfig get overwritten by the paths in the derived tsconfig.

So, you'll have to copy/move the paths from the base tsconfig to any derived tsconfig files.

And, be sure to decorate any path alias with a '@' so that it's distinguishable from other relative paths. I say this, because an import from "commonlib/src" is not obvious to be a path alias, and could simply be a relative path from the local src. But, "@commonlib/src" is easily recognized as a path alias, since '@' is not a legal leading folder/file character.

本文标签： javascriptMonorepo with paths from Typescript is not workingStack Overflow