Cannot locate component (goto definition) in a React project

[carlbolduc]

With the following code:

import React from "react";
import OtherComponent from "./OtherComponent";

const MainComponent = props => {
  return (
    <tr>
      <td>{props.item.date}</td>
      <td>{props.item.description}</td>
      <td style={{ textAlign: "center" }}>
        <OtherComponent onClick={() => props.doStuff()} />
      </td>
    </tr>
  );
};

export default MainComponent;

Calling xref-find-definitions using M-. (goto definition) in Emacs will go to the second line of the file (import OtherComponent from "./OtherComponent";) instead of actually going to the file where OtherComponent is defined.

Trying the same thing with typescript-language-server will go to the file where OtherComponent is defined.

More details about this issue can be found here: https://github.com/joaotavora/eglot/issues/243

[GertBurger]

Experiencing the same issue via https://github.com/autozimu/LanguageClient-neovim