Components inside typescript namespaces

[alarbada]

Describe the bug

Apparently components inside namespaces is not supported. I don't exactly know if the error comes from esbuild or something, but it would nice.

The bug is that is not shown as a compilation error.

Reproduction

Simply start a react-ts project with $ npm init @vitejs/app my-vue-app --template react-ts and write the following code:

namespace Lol {
  export const Lol = () => {
    return (
      <div>
        <p>Some component</p>
      </div>
    );
  };
}

function App() {
  return (
    <div className="App">
      <header className="App-header">
        <Lol.Lol />
        <p>Hello Vite + React!</p>
      </header>
    </div>
  );
}

export default App;

System Info

  System:
    OS: Linux 5.8 Ubuntu 20.04.2 LTS (Focal Fossa)
    CPU: (8) x64 Intel(R) Core(TM) i5-10210U CPU @ 1.60GHz
    Memory: 440.54 MB / 7.47 GB
    Container: Yes
    Shell: 5.8 - /usr/bin/zsh
  Binaries:
    Node: 14.16.0 - /usr/local/bin/node
    npm: 6.14.13 - /usr/local/bin/npm
  Browsers:
    Chrome: 90.0.4430.93
    Firefox: 89.0.1

Used package manager: npm

Logs

I get the following runtime error:

App.tsx:13 Uncaught ReferenceError: _c is not defined
    at App.tsx:13
    at App.tsx:14

I suppose it should be a compilation error?

---

Before submitting the issue, please make sure you do the following

• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Provide a description in this issue that describes the bug.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/vue-next instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.

[haoqunjiang]

Can be reproduced with the following babel config:

module.exports = {
  parserOpts: {
    plugins: ['jsx', 'typescript']
  },
  plugins: [
    [require('react-refresh/babel')]
  ]
}

I think it should be considered as a bug in the react-refresh package. Please report to the react team.

[gaearon]

We expect this to be fixed in [email protected]. Please verify. Thanks!

[haoqunjiang]

I can confirm that this bug no longer exists after bumping react-refresh to '^0.11.0' in #5245
The update will be included in the next @vitejs/plugin-react release.

Thanks!