TSC error while importing 'react-router-dom'

[DiogoAmann]

Hey,
I'm trying to import the 'react-router-dom' in a React typescript solution.
I first did the "npm install react-router-dom".

Right after importing like this: import {} from 'react-router-dom' in my tsx file, the compiler triggers the following errors:

[13:19:44] Error - [tsc] node_modules/react-router-dom/index.d.ts(3,13): error TS1005: '=' expected.
[13:19:44] Error - [tsc] node_modules/react-router-dom/index.d.ts(3,25): error TS1005: ';' expected.
[13:19:44] Error - [tsc] node_modules/react-router-dom/index.d.ts(5,1): error TS1128: Declaration or statement expected.
[13:19:44] Error - [tsc] node_modules/react-router-dom/index.d.ts(5,13): error TS1005: ';' expected.
[13:19:44] Error - [tsc] node_modules/react-router-dom/index.d.ts(5,283): error TS1005: ';' expected.
[13:19:44] Error - [tsc] node_modules/react-router/index.d.ts(2,13): error TS1005: '=' expected.
[13:19:44] Error - [tsc] node_modules/react-router/index.d.ts(2,64): error TS1005: ';' expected.
[13:19:44] Error - [tsc] node_modules/react-router/index.d.ts(4,1): error TS1128: Declaration or statement expected.
[13:19:44] Error - [tsc] node_modules/react-router/index.d.ts(4,13): error TS1005: ';' expected.

Does anyone have any ideas?

Thanks,
Diogo

[timdorr]

It sounds like you're using an old version of TypeScript. I'm not sure what our minimum is exactly, but you should be using at least 3.8 to support the import type syntax. I would recommend the latest version, though.

[DiogoAmann]

Hi @timdorr thanks for your quick reply.
Initially I thought the same so I ran "npm install -g typescript@latest" and the same issue persists.
The version of TypeScript is Version 4.5.2 (tsc -v).

I have a consistent repo, just need to do a "yo @microsoft/sharepoint" selecting React -> open in VS code -> run "npm install react-router-dom" and then do the import {} from 'react-router-dom'.

Any other ideas?
Thanks in advance.

[timdorr]

tsc will use whatever local version of TypeScript you have installed. So, you might have the latest version installed globally, but have an older version installed in that project. You'll need to update it to support react-router-dom v6.

[DiogoAmann]

I updated both globally (npm install -g typescript) as in the project (npm install typescript --save-dev).
Should I update something else?

[DiogoAmann]

Manage to solve it following these steps:
https://www.eliostruyf.com/define-the-typescript-version-you-want-to-use-in-sharepoint-framework/