build(esm): Use explicit .mjs extension for ESM, with CJS interop #7261
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This ensures that Node always treats the ESM output as ESM, despite the package.json (implicit) type of commonjs. Bundlers that expect ESM, such as Next v12, no longer explode when encountering this module. Refs react-hook-form#7244 Refs react-hook-form#7095 Refs react-hook-form#7088 Refs react-hook-form/resolvers#271 Refs vercel/next.js#30750
This was referenced Dec 10, 2021
|
thank you so much @evocateur 👍 |
|
going to release a beta on this. |
bluebill1049
added a commit
that referenced
this pull request
Dec 13, 2021
… (#7262) * build(esm): Use explicit .mjs extension for ESM, with CJS interop (#7261) * build(esm): Use explicit .mjs extension for ESM This ensures that Node always treats the ESM output as ESM, despite the package.json (implicit) type of commonjs. Bundlers that expect ESM, such as Next v12, no longer explode when encountering this module. Refs #7244 Refs #7095 Refs #7088 Refs react-hook-form/resolvers#271 Refs vercel/next.js#30750 * fix(esm-interop): Import non-ESM React as default * 7.21.3-beta.0 * update with v2 compress * fix lint error and update packages Co-authored-by: Daniel Stockman <5605+evocateur@users.noreply.github.com>
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Building off of #7244, hopefully addressing CRA issues (#7251) and react-hook-form/resolvers#301.
I believe the root cause for the CRA issue is that RHF uses the namespace import form (
import * as React from 'react') when it should be using a default import (import React from 'react'). React itself is not ESM, it's just a default export that Babel et al make-believe is a series of named exports, thus the error message folks are encountering in non-ESM tooling.I was surprised RHF isn't using
esModuleInterop: truein its tsconfig, and that has been addressed here. The test mock changes (one unused, one needing__esModule: trueflags) were triggered by this tsconfig change.Refs #7095
Refs #7088
Refs react-hook-form/resolvers#271
Refs vercel/next.js#30750