react-native - 预设选项中不允许 Babel 覆盖反应原生导航
问题描述
我试图在react-native上添加一个路由器react native navigation v2到这个启动项目,但我有一个与 babel 包有关的问题(可能)。当我跑
react-native run-android
我在 Metro Bundler 中有这个错误:
加载依赖图,完成。: 捆绑失败: 错误: [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) at Array.forEach () 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) 在 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) at Array.map () at recurseDescriptors (D:\react—native\projecti\node_modules\metro\node_modu les\Obabel\core\lib\config\full.js:66:38)
在控制台中构建成功结束。
我的 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 版本。
我看到你有2个解决方案:
1) 保持 RN 0.56 并设置正确的 babel deps
对于 RN 0.56,您需要确保所有 @babel/* deps 都固定在 7.0.0-beta.47 版本(请参阅 0.56 的更改日志)
2) 将您的项目升级到 RN 0.57
为了能够使用最新的 babel 7 依赖项,您必须将您的项目迁移到 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 更改日志的更多信息在这里:
https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md
更多关于 babel 7 deps 的信息在这里:
https://new.babeljs.io/docs/en/next/v7-migration.html#versioning-dependencies-blog-2017-12-27-nearing-the-70-releasehtml-peer-dependencies-integrations https:// /github.com/babel/babel-upgrade
有关在此处将 RN 项目升级到 babel 7 的更多信息:
React 从 babel 6 到 babel 7 的原生升级
注意:确保删除所有 node_modules 并重新安装它们并在 babel 版本修改后清理本地缓存。
rm -rf $TMPDIR/react-*; rm -rf $TMPDIR/haste-*; rm -rf $TMPDIR/metro-*; watchman watch-del-all
推荐阅读
- azure - Microsoft 应用程序注册门户不接受标准 http 重定向 URL
- julia - Julia中的空间自回归最大似然估计
- c++ - 有符号字符的按位运算
- c - 通过 C 中的循环阻塞进行优化
- c# - 使用 Access 数据库在 C# 中更新
- python - Matplotlib 极坐标投影打乱数据顺序(Excel 绘图正确)
- php - Instagram 私人 InstagramAPI\Instagram::_setUser() 错误
- python - Python/ Pygame:二维角动量/惯性
- python - 确定python中每个玩家的方差贡献
- android - 指定的资源路径无效