Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

RefreshRuntime is not added when primitive return type #414

Closed
7 tasks done
nojaf opened this issue Feb 19, 2025 · 4 comments
Closed
7 tasks done

RefreshRuntime is not added when primitive return type #414

nojaf opened this issue Feb 19, 2025 · 4 comments

Comments

@nojaf
Copy link

nojaf commented Feb 19, 2025

Describe the bug

When returning a plain string from a function component, the fast refresh is not added.
While I believe React does consider this as a valid component.

function Foo(props) {
  return 'meh2';
}

let make = Foo;

export { make };

Reproduction

https://stackblitz.com/edit/vitejs-vite-wzbtgaex?file=src%2FFoo.js

Steps to reproduce

  • npm i
  • npm run dev
  • Edit Foo.js (page reload)
  • Edit Bar.js (hmr reload)

System Info

System:
    OS: macOS 15.3
    CPU: (16) arm64 Apple M4 Max
    Memory: 698.27 MB / 64.00 GB
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 22.13.1 - ~/.nvm/versions/node/v22.13.1/bin/node
    npm: 10.9.2 - ~/.nvm/versions/node/v22.13.1/bin/npm
    pnpm: 9.15.5 - ~/.nvm/versions/node/v22.13.1/bin/pnpm
    bun: 1.2.2 - ~/.bun/bin/bun
  Browsers:
    Brave Browser: 133.1.75.178
    Chrome: 133.0.6943.99
    Safari: 18.3
  npmPackages:
    @vitejs/plugin-react: ^4.3.4 => 4.3.4 
    vite: ^6.1.0 => 6.1.0

Used Package Manager

npm

Logs

No response

Validations

@hi-ogawa
Copy link
Collaborator

Closing as a duplicate of #402. See #402 (comment) for details.

You can workaround this by injecting a magic word "react/jsx-runtime" somewhere in the code (or via plugin): https://stackblitz.com/edit/vitejs-vite-p4kpghhd?file=src%2FFoo.js

function Foo(props) {
  ('react/jsx-runtime');

  return 'meh2';
}

@nojaf
Copy link
Author

nojaf commented Feb 20, 2025

Thanks for this feedback @hi-ogawa !

@ArnaudBarre
Copy link
Member

ArnaudBarre commented Feb 20, 2025

@nojaf While injecting this works for now, it's mean to be used to add HMR to compiled code, not handwritten code. I highly suggest migrating your files to use .jsx. This gist might be helpful: https://gist.github.com/parties/90cdf35f9a3d05bea6df76dc83a69641

@nojaf
Copy link
Author

nojaf commented Feb 20, 2025

@ArnaudBarre I'm actually using ReScript which produces compiled JSX.
If my component only returns a primitive string, there is no react/jsx-runtime involved.
That is why I brought it up.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants