我正在尝试修改我的metro.config.js文件,这样它就不会忽略npm包的main
模块。
这是我在运行时收到的错误消息:
error: Error: While trying to resolve module `@apollo/client` from file `<project-directory>/src/ApolloProvider.tsx`, the package `<project-directory>/node_modules/@apollo/client/package.json` was successfully found. However, this package itself specifies a `main` module field that could not be resolved (`<project-directory>/node_modules/@apollo/client/main.cjs`. Indeed, none of these files exist:
* <project-directory>/node_modules/@apollo/client/main.cjs(.native|.ios.jsx|.native.jsx|.jsx|.ios.js|.native.js|.js|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.|.native.|.|.ios.json|.native.json|.json)
* <project-directory>/node_modules/@apollo/client/main.cjs/index(.native|.ios.jsx|.native.jsx|.jsx|.ios.js|.native.js|.js|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.|.native.|.|.ios.json|.native.json|.json)
at DependencyGraph.resolveDependency (<project-directory>/node_modules/metro/src/node-haste/DependencyGraph.js:311:17)
at Object.resolve (<project-directory>/node_modules/metro/src/lib/transformHelpers.js:129:24)
at resolve (<project-directory>/node_modules/metro/src/DeltaBundler/traverseDependencies.js:396:33)
at <project-directory>/node_modules/metro/src/DeltaBundler/traverseDependencies.js:412:26
at Array.reduce (<anonymous>)
at resolveDependencies (<project-directory>/node_modules/metro/src/DeltaBundler/traverseDependencies.js:411:33)
at processModule (<project-directory>/node_modules/metro/src/DeltaBundler/traverseDependencies.js:140:31)
at processTicksAndRejections (internal/process/task_queues.js:93:5)
at addDependency (<project-directory>/node_modules/metro/src/DeltaBundler/traverseDependencies.js:230:18)
at async Promise.all (index 3)
我可以清楚地看到<project-directory>/node_modules/@apollo/client/main.cjs
存在,但解析器似乎总是试图附加扩展名(而上面描述的main.cjs
文件不需要扩展名(。
以下是我的metro.config.js
文件:
module.exports = {
transformer: {
getTransformOptions: async () => ({
transform: {
experimentalImportSupport: false,
inlineRequires: true,
},
}),
},
resolver: {
sourceExts: ['jsx', 'js', 'ts', 'tsx', ''],
},
};
正如您所看到的,我已经尝试向sourceExts
属性的Array添加一个空字符串,但这并不能解决问题。
知道如何让这个Metro正确解析这个main.cjs
文件吗?
我最近遇到了这个错误,并尝试了相同的解决方案,但没有成功。它不起作用的原因是metro仍然会查找名为/path/to/file.js
的文件,并在.
后面附加配置数组中定义的扩展名。即使它是空的,它仍然会附加一个.
。
我不确定这是否适用于您,但就我而言,我没有更改bundler配置中的任何内容。解决我的问题的是为watchman和react native清除项目缓存。
# Clear watchman's cache
yarn watchman watch-del-all
# Clear react-native's cache
yarn react-native start --reset-cache