VSCode goToDefenition not working when .jsx and .js files of same name in same folder

Question

My structure is:

/Home
  /home.js
  /Home.jsx

In .jsx I'm trying to use go to defenition feature on path with webpack alias. To resolve webpack aliases I have jsconfig.json with this params:

{
  "compilerOptions": {
    "target": "es6",
    "module": "es6",
    "moduleResolution": "node",
    "jsx": "react-jsx",
    "baseUrl": "./",
    "paths": {
      "@/*": ["src/*"]
    }
  },
  "exclude": ["node_modules", "dist"]
}

And only in this type of situation

when .jsx and .js files of same name in same folder

I can't use the feature. If I rename file it starting to work. Also it works in WebStorm without any changes.

Please, tell me what's wrong...

score 1 · Answer 1 · answered Oct 04 '21 at 07:21

1

I fixed it!

The problem has disappeared when I deactivated this extenssion: JavaScript and TypeScript Nightly

answered Oct 04 '21 at 07:21

1nspir3

41
3

score 0 · Answer 2 · answered Sep 27 '21 at 16:19

VSCode uses TS engine under the hood to analyze JS. And the convention in TS is to omit file extension. So from TS engine’s POV, these two files of same name but diff extension are confusing.

I guess it’s just a limitation (or a bug? I’m not sure) of the TS language engine, not necessary anything you did wrong. WebStorm obviously uses other implementation to analyze/resolve package reference. Thus you don’t encounter problem there.

I don’t really know solution to your problem, can only provide above explanation. If I were you I’d just rename my file, not gonna spend time fighting tools.

Thanks a lot. With your explanation, I will easily push the new naming format to my team. — 1nspir3, Sep 27 '21 at 18:40

VSCode goToDefenition not working when .jsx and .js files of same name in same folder

2 Answers2