TypeScript type resolve fails for symlinked folders (pnpm)
Does this issue occur when all extensions are disabled?: Yes/No
- VS Code Version: 1.73.1
- OS Version: ProductName: macOS ProductVersion: 12.6 BuildVersion: 21G115
Steps to Reproduce:
Here is a video of the issue https://user-images.githubusercontent.com/33131460/203819438-464d7205-ab57-4b96-8f88-4d38b916fca5.mp4
- Clone https://github.com/kamnakis/vscode-symlink-issue-reproduction
- Install pnpm globally if you haven't already.
- Run
pnpm i - Go to
node_modules/react-router-dom/dist/index.d.ts - Types from
react-routerand@remix-run/routerare not resolved even though they are defined in the dependencies ofreact-router-dom.
I think the issue is happening because the node_modules/react-router-dom is a symlink and vs code looks at the copy and not the original folder.
Does this reproduce in the latest VS Code insiders build with all extensions disabled?
Does this reproduce in the latest VS Code insiders build with all extensions disabled?
Just checked! Yes it does!
Since this was moved in the TypeScript repository, let me share something I noticed while investigating on this error. Hope it helps.
Let's say I import a third party module (e.g. react-router-dom) and the ./node_modules/react-router-dom is a symlink folder.
- If there is a path in the tsconfig that matches that package, then typescript looks at the copy folder (symlinked) and not the original.
- If none of the paths matches that package, therefore it resolves with the default module resolution then it looks at the original folder.
Here is a video:
https://user-images.githubusercontent.com/33131460/205047528-d083599e-3498-46e5-89d4-ed40f223fda9.mp4
Typescript resolve the symlinked dependency (installed using pnpm) but pins the resolved path to physical folders. for me this becomes an issue when a new version of the dependency is installed but TypeScript intellisense keeps pointing to the old version.
The only workaround I know is restarting VS Code. Is there a better / another workaround?
EDIT:
Asking the question helps to think clearer. A better workaround is to restart just the typescript server
My issue seems to be fixed with Typescript v5.04
My issue seems to be fixed with Typescript v5.04
Just for the reference, mine issue is still there even with v5.04
Issue still exists. I dont know how people are using pnpm projects in vscode. I had switched from npm and yarn to pnpm but stuck with this issue vscode doesnt use the workspace typescript version as it says it can't resolve the typescript library. If anyone could share how they got this working it would be really helpful
@kamnakis and everyone I found the fix, you should actually use the absolute path to the typescript and it will resolve the symlink. In vscode (I am using in windows) typescript cannot understand symlink if you provide relative path so instead of node_modules/typescript/lib provide the entire path like "typescript.tsdk": "C:/Users/YOUR_USER_NAME/PATH/TO_YOUR/PROJECT_ROOT/node_modules/.pnpm/[email protected]/node_modules/typescript/lib" in your workspace settings json. eg:
"typescript.tsdk": "C:/Users/abcuser/projects/my-app/node_modules/.pnpm/[email protected]/node_modules/typescript/lib", Hope this helps everyone.
Then ctrl+p and then type typescript restart server and restart your typescript server or reload the window or just close and open vscode