react-admin
react-admin copied to clipboard
Add exports entry point to support node's module resolution.
React admin provides cjs and esm bundles. However, it relies on main
and module
in the package.json file to decide which version to use. It will work with most bundlers but fails when using node's module resolution as it doesn't support the module
field. I was hit with this problem when trying to test a component using vitest.
Example:
function ComponentA() {
return <SimpleForm><ComponentB /></SimpleForm>
}
function ComponentB() {
const { watch } = useFormContext()
return ...
}
SimpleForm is loaded using cjs and uses FormProvider (cjs) from react-hook-form. ComponentB uses useFormContext from react-hook-form esm bundle and context will be null.
Describe the solution you'd like
Add exports
to package.json specifying the entry points for import
and require
.
Additional context https://github.com/vitest-dev/vitest/discussions/4233 https://nodejs.org/api/packages.html#package-entry-points
I successfully tried https://github.com/isaacs/tshy/ on another project. Might be worth investigating
hey @djhi thanks for your suggestion. I don't see how tshy could help in this case, though. react-admin already supports esm and cjs, the only missing piece is the exports field. Am I missing something?
It does what we currently do but better and would handle the exports for us
I see, I thought you meant for it to be fixed on userland, my mistake.
I took a look at tshy but I'm not really sure how to tackle it. It seems very opinionated where it forces us to use moduleResolution: 'nodenext'. This won't allow it to build bc it requires to add file extensions to imports.
Please, correct me if I'm wrong, but since we already have esm and cjs builds, manually adding exports
to package.json seems to be a simpler fix.
Indeed, that's probably what we'll do for now.