Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Regression] InlineAutocomplete uses ESM only module textarea-caret breaking Next.js #2238

Closed
Swiftwork opened this issue Aug 17, 2022 · 1 comment · Fixed by #2244
Closed
Assignees

Comments

@Swiftwork
Copy link
Contributor

Describe the bug
The changes introducing InlineAutocomplete break previously working builds using Next.js due to the fact that it uses the ESM only module @koddsson/textarea-caret.

To Reproduce
Steps to reproduce the behavior:

  1. Setup a new next.js app
  2. Add @primer/react
  3. Use primer components
  4. See error

Expected behavior
Continued support for Next.js with no build errors. Possibly by inlining work provided by @koddsson/textarea-caret @primer/react.

Screenshots

Error: require() of ES Module C:\Projects\Git\@org\project\.yarn\cache\@koddsson-textarea-caret-npm-4.0.1-58e5d1bae2-7a44f96cdf.zip\node_modules\@koddsson\textarea-caret\index.js from C:\Projects\Git\@org\project\.yarn\__virtual__\@primer-react-virtual-c9b4fb8b62\0\cache\@primer-react-npm-35.6.0-0eb6ab2331-c71e61be84.zip\node_modules\@primer\react\lib\drafts\utils\character-coordinates.js not supported.
Instead change the require of index.js in C:\Projects\Git\@org\project\.yarn\__virtual__\@primer-react-virtual-c9b4fb8b62\0\cache\@primer-react-npm-35.6.0-0eb6ab2331-c71e61be84.zip\node_modules\@primer\react\lib\drafts\utils\character-coordinates.js to a dynamic import() which is available in all CommonJS modules.
    at Object.require$$0.Module._extensions..js (C:\Projects\Git\@org\project\.pnp.cjs:19891:15)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.require$$0.Module._load (C:\Projects\Git\@org\project\.pnp.cjs:19735:14)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (C:\Projects\Git\@org\project\.yarn\__virtual__\@primer-react-virtual-c9b4fb8b62\0\cache\@primer-react-npm-35.6.0-0eb6ab2331-c71e61be84.zip\node_modules\@primer\react\lib\drafts\utils\character-coordinates.js:8:45)
    at Module._compile (node:internal/modules/cjs/loader:1105:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1159:10)
    at Object.require$$0.Module._extensions..js (C:\Projects\Git\@org\project\.pnp.cjs:19895:33)
    at Module.load (node:internal/modules/cjs/loader:981:32) {
      code: 'ERR_REQUIRE_ESM'
    }

Desktop (please complete the following information):

  • OS: All
  • Browser: All
  • Version: 35.6.0

Smartphone (please complete the following information):

  • Device: All
  • OS: All
  • Browser: All
  • Version: 35.6.0
@iansan5653 iansan5653 self-assigned this Aug 17, 2022
@iansan5653
Copy link
Contributor

Thanks for the detailed report, and sorry for the regression! I'll take a look at this and work on a fix.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants