Bug: [Refresh] Default exported unnamed functions are ignored

[davidbonnet]

React version: 17.0.2
React-refresh version: 0.10.0

This issue is similar to #21179, but ignores default exported unnamed functions instead.

As a code comment suggests, this is a known limitation:

react/packages/react-refresh/src/ReactFreshBabelPlugin.js

Lines 437 to 438 in a817840

	// Anonymous direct exports like export default function() {}
	// are currently ignored.

Would a fix be considered?

Steps To Reproduce

Given the following files, making changes to Component.js doesn't trigger a re-render.

main.js module:

import React from 'react'
import { render } from 'react-dom'

import Component from './Component.js'

function App() {
  return <main><Component /></main>
}

render(<App />, window.document.getElementById('root'))

Component.js module:

import React from 'react'

export default ({ value = "Hello" }) => (<div>{value}</div>)

The current behavior

Making changes to Component.js does not re-render the element in main.js.
The transformed Component.js module does not register the Component for refresh.

The expected behavior

Making changes to Component.js does re-render the element in main.js.

[gaearon]

This is intentional — even if we fix this case, we need some heuristic for other tools like lint rules. Why are you using this style? Functions should have names so that you get them in stack traces and so on.

[davidbonnet]

Indeed, but then it becomes confusing: vitejs/vite-plugin-react#20.

If there's no way around, this can be closed and I'll make a suggestion downstream to use https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/function-component-definition.md. The code comment mentioned above should then also be more explicit, replacing "currently" by "intentionally".

[davidbonnet]

However, given that an ignored component prevents a refresh (vitejs/vite-plugin-react#20), I haven't figured out yet whether this is an issue with react-refresh itself or with @vitejs/plugin-react-refresh. AFAIK, a code update of an ignored component should still trigger a refresh.

[github-actions]

This issue has been automatically marked as stale. If this issue is still affecting you, please leave any comment (for example, "bump"), and we'll keep it open. We are sorry that we haven't been able to prioritize it yet. If you have any new additional information, please include it with your comment!

[github-actions]

Closing this issue after a prolonged period of inactivity. If this issue is still present in the latest release, please create a new issue with up-to-date information. Thank you!