Possibly greedy reactCompilerPreset regex

[hilja]

I don't fully understand what this regex is trying to match?

The \b[A-Z] part matches almost any capital letter. \buse matches for example 'use-credentials'.

Is it meant to match React components and hooks? If so it's a bit greedy. Anyway, thanks for maintaining this package!

Regex101 link: https://regex101.com/r/VTYx5E/1

vite-plugin-react/packages/plugin-react/src/reactCompilerPreset.ts

Line 20 in 704e0d3

: /\b[A-Z]|\buse/,

[hilja]

Regex is not my strong suite but maybe something like /(?:\s<[A-Z]+)|\buse(?:[A-Z]+|\(|<)/.

https://regex101.com/r/sfcANF/1

[sapphi-red]

It needs to match any code that returns a string for this function:
https://github.com/facebook/react/blob/9c0323e2cf9be543d6eaa44419598af56922603f/compiler/packages/babel-plugin-react-compiler/src/Entrypoint/Program.ts#L1049-L1078

/(?:\s<[A-Z]+)|\buse(?:[A-Z]+|\(|<)/

We cannot use this because it won't match:

import { jsx } from 'react/jsx-runtime';
export function A() { return jsx('p', { children: 'hello' }) };

[hi-ogawa]

Not directly related, but I think we can also document that reactCompilerPreset is only a convenient helper and users are free to write down filter on their own to fit their project structure (for example, if they know some large part of files are never react/hook related or react compiler cannot help, they might be able to aggressively exclude.)

[hilja]

It needs to match any code that returns a string for this function

Ah, okay. That makes more sense.