Search code examples
typescriptnpm

how to upgrade typescript to a new major version


The typescript runtime in my git repo still shows 4.9.5 even after I upgraded all packages and deleted node_modules and package-lock.json and re-installed with npm install.

How can I get the tsc version to be more recent than 5.0 ?

$ npx tsc --version
Version 4.9.5

$ ./node_modules/.bin/tsc --version
Version 4.9.5

I have a NPM monorepo where all packages list "typescript" as a dev dependency. A while back I used "npm uninstall typescript" on each package, then re-added via "npm install typescript -D" so the package dependencies listed the new major version (was v4, now v5).

When I build one of my packages (create-react-app) it shows me ESLint believes I'm using typescript version 4.9.5.

WARNING: You are currently running a version of TypeScript which is not officially supported by @typescript-eslint/typescript-estree.

You may find that it works just fine, or you may not.

SUPPORTED TYPESCRIPT VERSIONS: >=3.3.1 <4.9.0

YOUR TYPESCRIPT VERSION: 4.9.5

Please only submit bug reports when using the officially supported version.

None of my package.json files or package-lock.json file display v4. All show v5.

$ npm list --depth=0 | grep -i typescript
│ └── [email protected]
│ └── [email protected]
│ ├── [email protected]
│ └── [email protected]
│ ├── [email protected]
│ ├── @babel/[email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── @babel/[email protected] deduped
│ ├── @rollup/[email protected]
│ └── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
│ └── [email protected]
│ └── [email protected]
│ └── [email protected]
│ └── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── [email protected]
│ ├── @babel/[email protected] deduped
│ ├── [email protected]
│ ├── [email protected]
│ └── [email protected]
│ ├── [email protected]
│ └── [email protected]
│ └── [email protected]
│ ├── [email protected]
│ └── [email protected]
│ └── [email protected]
│ └── [email protected]

I am currently using node 16.19 and npm 8.11 via nvm.

$ node --version
v16.19.1
$ npm --version
8.19.3

EDIT: This post is about Typescript, not React or Create-React-App, in a NPM workspaces (mono) repo. Sorry for any confusion.


Solution

  • If you are

    1. using a NPM workspaces monorepo,
    2. and the nested packages have a (dev) dependency on Typescript,
    3. and you've upgraded the typescript version,
    4. but npx tsc --version still shows the old version

    For example:

    $ cd <repo_clone_directory>
    
    $ ls -1 packages/
    micro-service-1
    micro-service-2
    ui-1
    ui-2
    
    $ npx tsc --version
    Version 4.9.5
    

    Then you probably need to ADD a (dev) dependency on Typescript in your top-level package.json file.

    $ cd <repo_clone_directory>
    
    $ npm install typescript
    
    $ npx tsc --version
    Version 5.2.2
    

    And if your CreateReactApp package is complaining that your typescript version is not supported when ESLint runs, then you should

    1. temporarily disable ESLint.
    2. eventually migrate to vitejs as CRA has been abandoned.

    From packages/ui-1/package.json

      "scripts": {
        "start": "DISABLE_ESLINT_PLUGIN=true react-scripts start",
        "build": "DISABLE_ESLINT_PLUGIN=true react-scripts build",
    

    EDIT: Adding "typescript" to the top-level package.json also helps with minor version upgrades.