tsconfig.json extends from base not found

Question

I'm trying to setup a new project where I want to use typescript (and eslint, prettier and jest but that's less important). I'm following this tutorial: https://www.youtube.com/watch?v=-sswKgneCVI

However in the tsconfig.json file I get an error. The way I have set up the project:

yarn init
yarn add typescript
yarn add ts-node @types/node @tsconfig/node20 --dev
touch tsconfig.json

I've got the following tsconfig.json:

{
  "extends": "@tsconfig/node20/tsconfig.json",
  "compilerOptions": {
    "outDir": "./dist",
    "rootDir": "./src",
    "forceConsistentCasingInFileNames": true
  },
  "include": ["src/**/*"],
  "exclude": ["node_modules", "dist"]
}

It fails to resolve @tsconfig/node20/tsconfig.json and VS code show the following message when I hover over it: File '@tsconfig/node20/tsconfig.json' not found.

I am on a Mac, using Yarn 4.5.1 and node v20.18.0 (used nvm to install it).

I can't find anything on the internet, but could this be caused yarn using zero-installs?

Installed everything according to above shell scripts and didn't expect an error.

David Adokuru · Accepted Answer · 2024-11-09 21:54:22Z

2

Yarn cache might be causing your issue, try clearing the cache yarn cache clean and installing with yarn add @tsconfig/node20 --dev, then run yarn install

Hopefully, this solves your issue. I tried this on my mac and it works

answered Nov 9, 2024 at 21:54

David Adokuru

4462 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Yorian Over a year ago

That doesn't help sadly enough

Javien · Accepted Answer · 2024-11-11 06:59:11Z

It's the way yarn manages packages. Yarn uses zip files in the .yarn folder, so whoever is trying to access the dependencies (e.g. editor extensions) won't be able to access them because they'll be looking for the node_modules folder. And Yarn provides some workarounds for this.

1. Setting up the IDE SDKs.

If you didn't setup the IDE SDKs, follow this instruction: https://yarnpkg.com/getting-started/editor-sdks.

2. Unplug the package.

In most cases, setting up the SDKs will fix the problem. But if it doesn't, you can try unpacking the package. This unpacks a zip dependency so that everyone can access it without Yarn.

yarn unplug @tsconfig/node20

The unplugged dependency locates at .yarn/unplugged (unless you change the config).

Now, change your config like this:

{
  "extends": "./.yarn/unplugged/@tsconfig-node20-npm-20.1.4-34948615bc/node_modules/@tsconfig/node20/tsconfig.json"
}

The unplugged folder contains a random (I guess) hex value, so make sure it's yours. Also, unless you're using zero install, this is not a perfect method, since everyone has to do it again.

3. Just copy the base `tsconfig.json`

If I were you, I would just copy the base tsocnfig file and paste it directly. A lot of people do this because they want to reduce the number of dependencies, and it's easy to maintain configs. So, it's totally fine.

Visit https://github.com/tsconfig/bases and choose the base file, and copy compilerOptions.

{
  "compilerOptions": {
    "lib": ["es2023"],
    "module": "node16",
    "target": "es2022",

    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "moduleResolution": "node16"
  }
}

https://github.com/tsconfig/bases/blob/main/bases/node20.json

Collectives™ on Stack Overflow

tsconfig.json extends from base not found

2 Answers 2

1 Comment

1. Setting up the IDE SDKs.

2. Unplug the package.

3. Just copy the base `tsconfig.json`

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

1. Setting up the IDE SDKs.

2. Unplug the package.

3. Just copy the base tsconfig.json

Comments

Your Answer

Sign up or log in

Post as a guest

Related

3. Just copy the base `tsconfig.json`