预设选项中不允许Babel改写反应本机导航 [英] Babel overrides is not allowed in preset options react native navigation
问题描述
我尝试添加路由器反应本机导航v2 到 react-native 上的这个入门项目，但是我有与babel软件包有关的问题(可能).当我运行
I trying to add a router react native navigation v2 to this starter project on react-native, but I have a problem that is connected with babel package (probably). When I run
react-native run-android
我在Metro Bundler中遇到此错误:
I have this error in Metro Bundler:
已完成加载依赖关系图. :捆绑失败:错误:[BABEL] D:\ react-native \ projecti \ index.js:预设选项中不允许.overr ide
loading dependency graph, done. : bundling failed: Error: [BABEL] D:\react—native\projecti\index.js: .overr ides is not allowed in preset options
在Object.keys.forEach.key(D:\ react-native \ projecti \ node_modules \ metro \ node odules \ Obabel \ core \ lib \ config \ validation \ options.js:71:13) 在Array.forEach() 验证时(D:\ react-native \ projecti \ node_modules \ metro \ node_modules \ nabel core \ lib \ config \ validation \ options.js:69:21) 在实例化预设时(D:\ react-native \ projecti \ node_modules \ metro \ node_modul s \ l @ babel \ core \ lib \ config \ full.js:242:36) 在cachedFunction(D:\ react-native \ projecti \ node_modules \ metro \ node_modules \ babel \ core \ lib \ config \ caching.js:42:19) 在loadPresetDescriptor时(D:\ react-native \ projecti \ node_modules \ metro \ node_mo Iules \ ftabel \ core \ lib \ config \ full.js:233:45) 在config.presets.map.descriptor(D:\ react-native \ projecti \ node_modules \ metr I \ node_modules \ ftabel \ core \ lib \ config \ full.js:68:19) 在Array.map() 在recurseDescriptors(D:\ react-native \ projecti \ node_modules \ metro \ node_modu les \ Obabel \ core \ lib \ config \ full.js:66:38)
at Object.keys.forEach.key (D:\react—native\projecti\node_modules\metro\node odules\Obabel\core\lib\config\validation\options.js:71:13) at Array.forEach () at validate (D:\react—native\projecti\node_modules\metro\node_modules\nabel core\lib\config\validation\options.js:69:21) at instantiatePreset (D:\react—native\projecti\node_modules\metro\node_modul s\l@babel\core\lib\config\full.js:242:36) at cachedFunction (D:\react—native\projecti\node_modules\metro\node_modules\ babel\core\lib\config\caching.js:42:19) at loadPresetDescriptor (D:\react—native\projecti\node_modules\metro\node_mo Iules\ftabel\core\lib\config\full.js:233:45) at config.presets.map.descriptor (D:\react—native\projecti\node_modules\metr I\node_modules\ftabel\core\lib\config\full.js:68:19) at Array.map () at recurseDescriptors (D:\react—native\projecti\node_modules\metro\node_modu les\Obabel\core\lib\config\full.js:66:38)
在控制台中的构建成功结束.
Building in console ended successfully.
我的package.json
My package.json
{
"name": "project1",
"version": "0.0.1",
"private": true,
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
"android": "cd ./android && ./gradlew app:assembleDebug && ./gradlew installDebug"
},
"dependencies": {
"@babel/runtime": "^7.1.2",
"react": "16.5.0",
"react-native": "0.56",
"react-native-navigation": "^2.0.2569"
},
"devDependencies": {
"@babel/core": "^7.1.0",
"@babel/preset-env": "^7.1.0",
"babel-eslint": "^9.0.0",
"babel-jest": "^23",
"babel-preset-react-native": "^5",
"jest": "23.6.0",
"metro-react-native-babel-preset": "0.47.0",
"react-test-renderer": "16.5.0"
},
"jest": {
"preset": "react-native"
}
}
.babelrc
{
"presets": [
"@babel/preset-env",
"module:metro-react-native-babel-preset"
]
}
推荐答案
似乎您拥有RN 0.56，该版本使用了一些babel的beta版本.
It seems that you have RN 0.56 which used some beta versions of babel.
我看到您有2种解决方案:
I see you have 2 solutions:
1)保持RN 0.56并设置正确的babel deps
对于RN 0.56，您需要确保所有@ babel/* deps都固定在7.0.0-beta.47版本中(请参阅0.56的更改日志)
For RN 0.56 you need to ensure all the @babel/* deps are fixed at version 7.0.0-beta.47 (Please see the change log of 0.56 for those)
2)将项目升级到RN 0.57
要使用最新的babel 7依赖项，您必须将项目迁移到RN 0.57.
To be able to use latest babel 7 dependencies you will have to migrate your project to RN 0.57.
This is what I have for a 0.57.1 project:
"dependencies": {
"react": "16.5.0",
"react-native": "0.57.1",
.......
}
"devDependencies": {
"@babel/core": "^7.0.0",
"@babel/plugin-proposal-class-properties": "^7.0.0",
"@babel/plugin-proposal-decorators": "^7.0.0",
"@babel/plugin-proposal-do-expressions": "^7.0.0",
"@babel/plugin-proposal-export-default-from": "^7.0.0",
"@babel/plugin-proposal-export-namespace-from": "^7.0.0",
"@babel/plugin-proposal-function-bind": "^7.0.0",
"@babel/plugin-proposal-function-sent": "^7.0.0",
"@babel/plugin-proposal-json-strings": "^7.0.0",
"@babel/plugin-proposal-logical-assignment-operators": "^7.0.0",
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.0.0",
"@babel/plugin-proposal-numeric-separator": "^7.0.0",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0",
"@babel/plugin-proposal-optional-chaining": "^7.0.0",
"@babel/plugin-proposal-pipeline-operator": "^7.0.0",
"@babel/plugin-proposal-throw-expressions": "^7.0.0",
"@babel/plugin-syntax-dynamic-import": "^7.0.0",
"@babel/plugin-syntax-import-meta": "^7.0.0",
"@babel/plugin-syntax-object-rest-spread": "^7.0.0",
"@babel/plugin-transform-runtime": "^7.0.0",
"@babel/preset-env": "^7.0.0",
"@babel/preset-flow": "^7.0.0",
"@babel/register": "^7.0.0",
"babel-core": "^7.0.0-bridge.0",
"babel-preset-react-native-stage-0": "^1.0.1",
.....
}
重要:将.babelrc配置更新为:
{
"presets": ["module:metro-react-native-babel-preset"]
}
有关RN 0.56、0.57更改日志的更多信息，请点击此处:
More info about RN 0.56, 0.57 change log here:
https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md
有关babel 7部门的更多信息，请点击此处:
More info about babel 7 deps here:
https://github.com/babel/babel-upgrade
有关在此处将RN项目升级到babel 7的更多信息:
More info about upgrading a RN project to babel 7 here:
注意:在修改babel版本后，请确保删除所有node_modules并重新安装它们并清理本地缓存.
Note: make sure you remove all node_modules and re-install them and clean local cache after babel versions modifications.
rm -rf $TMPDIR/react-*; rm -rf $TMPDIR/haste-*; rm -rf $TMPDIR/metro-*; watchman watch-del-all
这篇关于预设选项中不允许Babel改写反应本机导航的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
