The following example is case-sensitive!
Given a file b.tsx:
export default () => <div>ABCDEF</div>
Being imported in a.tsx with the wrong casing:
import B from './B';
export default () => {
return <B/>
}
Will result in Fast refresh working once, but not twice. This behavior can also be seen in Next.JS, reproduction here: https://github.com/JonnyBurger/watchpack-bug-repro To reproduce, Change the content in Hello.tsx twice.
If a file is imported with the uppercase filename, the watcher will still be registered on the lowercase filename. If the collectTimeInfoEntries function is called, the time info entries for the uppercase names are requested, but they are not in the map and null is returned. Somewhere else in Webpack this leads to the module not being invalidated because null has a meaning of the file not existing at all.
Sending a PR for this!
The following example is case-sensitive!
Given a file
b.tsx:Being imported in
a.tsxwith the wrong casing:Will result in Fast refresh working once, but not twice. This behavior can also be seen in Next.JS, reproduction here: https://github.com/JonnyBurger/watchpack-bug-repro To reproduce, Change the content in
Hello.tsxtwice.If a file is imported with the uppercase filename, the watcher will still be registered on the lowercase filename. If the
collectTimeInfoEntriesfunction is called, the time info entries for the uppercase names are requested, but they are not in the map andnullis returned. Somewhere else in Webpack this leads to the module not being invalidated becausenullhas a meaning of the file not existing at all.Sending a PR for this!