- Sponsor
-
Notifications
You must be signed in to change notification settings - Fork 49
Closed
Description
Because .cjs
source extension is not very commonly used and React Native do not know it and interprets as part of filename.
error: bundling failed: Error: While trying to resolve module `nanoevents` from file `.../src/api/ws/client.js`, the package `.../node_modules/nanoevents/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`.../node_modules/nanoevents/index.cjs`. Indeed, none of these files exist:
* .../node_modules/nanoevents/index.cjs(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)
* .../node_modules/nanoevents/index.cjs/index(.native|.android.js|.native.js|.js|.android.json|.native.json|.json|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx)
Workarounds:
import {createNanoEvents} from 'nanoevents/index'
- add
.cjs
extension tometro.config.js
:
const {getDefaultValues} = require('metro-config/src/defaults')
const {resolver: {sourceExts}} = getDefaultValues()
module.exports = {
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: false,
},
}),
},
resolver: {
sourceExts: [...sourceExts, 'cjs'],
},
}
But it will be nice nanoevents package do not cause the error and works without need an additional configuration.
- Use
index.cjs.js
file name instead - Or add
react-native
field topackage.json
withindex.js
value
Metadata
Metadata
Assignees
Labels
No labels
Projects
Milestone
Relationships
Development
Select code repository
- Bump uuid from 3.4.0 to 8.3.2sthamizhselvan/postManCollection
- Bump uuid from 3.4.0 to 8.3.2statisticsnorway/design-system
- Bump uuid from 3.4.0 to 8.3.2statisticsnorway/ssb-component-library
- Bump uuid from 3.4.0 to 8.3.2sealink/printers_qt
- chore(deps): bump uuid from 3.4.0 to 8.3.2 in /packages/stark-corenicanac/stark
- Bump uuid from 3.4.0 to 8.3.2Imageus-OSS/server
- Bump uuid from 3.4.0 to 8.3.2 in /web/watsconcourse/concourse
Activity
TrySound commentedon Mar 20, 2020
This extension is part of node resolution algorithm and a requirement for conditional exports (native node es modules support). The best solution is to open the issue in metro bundler to support it out of the box.
Alternatively you can specify to prefer "module" entry point over "main". Though idk if it's possible in metro.
farwayer commentedon Mar 20, 2020
As I can see
type
,main
,module
andexports
fields are already defined inpackage.json
so nodejs already knows all necessary info for importing package in any mode even without using.cjs
extension.nanoevents is first package I ran into this problem with React Native. Does all other packagers know about
.cjs
? If it is standard extension than of course it is better to add support of this to metro bundler. But if it is Nodejs only then maybe it is better to use more default.js
to prevent such situations IMO.TrySound commentedon Mar 20, 2020
If type is "commonjs" then all es modules should have mjs extension. If type is "module" then all commonjs modules should have cjs extension. This is how dual mode works in node. Module types have to be distinct somehow. It's the first package because only a few migrated yet. Node removed experimental flag only a few weeks ago.
TrySound commentedon Mar 20, 2020
I mean it's technical requirement not just fancy feature.
ai commentedon Mar 20, 2020
We need
.cjs
name, because otherwise, Node.js will load it as ES module.Most of the npm packages do not provide ESM for Node.js. Most of the packages provide ESM for webpack only, which does not follow the spec.
Yeap, it is part of Node.js standard.
Yes, we should start by creating an issue in the metro builder. Can you do it since I am less familiar with the React Native ecosystem?
I do not like “it is your tool” problem answer in the issue. You have a real problem and we need a solution.
Right now I see this solution:
index.mjs
instead ofindex.js
index.js
instead ofindex.cjs
type: 'module'
frompackage.json
index.mjs
onrequire('nanoevents/index.js')
.Unfortunately, we need to support all kind of ESM environments:
Unfortunately the
index.js → index.mjs
fix will force all CDN users to manually addindex.mjs
to the URLs. I will think about the better solution today and, if I will not find the best solution, I will think about who we should suffer in the situation.ai commentedon Mar 20, 2020
Another idea is to create separated
index.native.js
for each file and use them instead ofindex.cjs
bypackage.react-native
directive.ai commentedon Mar 21, 2020
I opened an issue in Metro builder
facebook/metro#535
ai commentedon Mar 21, 2020
@farwayer can you try Nano Events 5.1.1 with this config?
farwayer commentedon Mar 21, 2020
Wow, thank you a lot Andrew for fast answer and fixes. I do not like “it is your tool” problem answer too and try to make everything work out of the box for users. JS ecosystem is already very difficult for developers to add even more complexity.
Some suggestions:
react-native
field with path to ESM index file. It is enough.One more small issue I trap into is warning while starting metro server:
Look like metro trying to import
nanoevents/package.json
file internally and can't find it inexports
. But everything works without problems.TrySound commentedon Mar 21, 2020
@ai fix "csj" in metro issue
ai commentedon Mar 21, 2020
If I send ESM files to Metro I got
lib/a/index.js
is:Here is the test
@farwayer
package.json
warnings?export
error described above? Maybe it is just bug in my test environmentfarwayer commentedon Mar 22, 2020
ai commentedon Mar 22, 2020
@farwayer I found that you PR didn’t fix the problem
New metro doesn’t load
pkg['react-native]
anymore. With your fix React Native still goes topkg.main
and looks forindex.cjs
. Your fix works because RN resolves thatindex.cjs
toindex.cjs.js
.But at least it does not require to change
resolverMainFields
.Here is
dual-publish test fix, that shows, that React Native just transpiles
import/export` calls by Babel to CommonJS and has no ESM support. ai/dual-publish@0ff0d7d27 remaining items