babel eagerEsModules, ESM Modules, and missing file extensions

[advl]

Hi !

I working to make a collection of react/relay components a pure ES package to be published on npm. I have figured out that, to remove the require calls in the generated relay queries/artifacts with babel, I should use the eagerEsModule option in the compiler and the babel plugin. The goal is to use modules:false in @babel/preset-env to only load very conservatively TS into ESM and not apply code transforms aside from the relay babel plugin. I have also enabled "type":"module" in package.json.

I have found that while eagerEsModule does get rid of the require calls, changed to import statements, I stumble on the following error, since the compiled relay code imports .graphql files instead of .graphql.js

Module not found: Error: Can't resolve './__generated__/ViewerProfileQuery.graphql' in '/front/packages/design-system/dist/ui/app.base/ViewerProfile'
Did you mean 'ViewerProfileQuery.graphql.js'?
BREAKING CHANGE: The request './__generated__/ViewerProfileQuery.graphql' failed to resolve only because it was resolved as fully specified
(probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"').
The extension in the request is mandatory for it to be fully specified.
Add the extension to the request.

This is the code generated by the compiler :

import _ViewerProfileQuery from "./__generated__/ViewerProfileQuery.graphql";

I believe that, to comply with the ES Module specification, the eagerEsModules option should instead provide import _ViewerProfileQuery from "./__generated__/ViewerProfileQuery.graphql.js"; , or at least have an additional option to append a file extension. Not being so is painful, and makes is necessary to use another babel/webpack plugin or script to comply with the ES Module definition. I would love to hear your thoughts on that - also if I'm missing anything on my end to make that build work out. If I'm not mistaken, is this a change/feature that could be considered ?

For the past months, to resolve this issue I have been using a fork of https://github.com/silane/babel-plugin-replace-import-extension to manage that a compile time, but I believe it should not be necessary.

Finally, I would also like to bring to discussion a potential need for more documentation about the thinking behind eagerEsModules and its usage.

Thank you for the great library and work !