将本机从babel 6升级到babel 7
从babel 6升级到babel 7的步骤是什么？
这些是旧的依赖关系：
"dependencies": {
.........
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-latest": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.24.1",
"prop-types": "^15.5.10",
"react": "16.3.1",
"react-native": "0.55.4",
"react-redux": "5.0.7",
"redux": "^4.0.0",
"redux-actions": "^2.6.1",
"redux-mock-store": "^1.5.1",
"redux-persist": "^5.10.0",
"redux-thunk": "^2.1.0",
},
"devDependencies": {
"babel-eslint": "^8.2.2",
"babel-plugin-syntax-object-rest-spread": "^6.13.0",
"babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-preset-react-native": "^4.0.0",
"babel-preset-react-native-stage-0": "^1.0.1",
"eslint": "^4.18.1",
"eslint-config-airbnb": "^17.0.0",
"eslint-plugin-flowtype": "^2.46.1",
"eslint-plugin-import": "^2.14.0",
"eslint-plugin-jsx-a11y": "6.1.1",
"eslint-plugin-react": "^7.4.0",
"gulp": "^3.9.0",
"gulp-eslint": "4.0.2",
"gulp-mocha": "6.0.0",
"jest": "^23.5.0",
.....
},您需要遵循哪些步骤才能进行此更新？新的依赖项应该是什么样的呢？
我还不太清楚(在阅读了babel之后)，我应该做些什么来进行这次升级，运行命令，以及应该在依赖项中添加什么以及在devDependencies中添加什么。
另外，对我来说还不太清楚babel 6和babel 7之间的区别在于JS代码在一个反应本机项目中发生了什么。
请不要只回复到babel的链接或响应-本机0.57的更改日志。
我至少需要一些基本步骤来完成这一升级，并以一个基于babel 7的RN项目的package.json为例。
回答 3
Stack Overflow用户
发布于 2018-10-09 09:17:17
简短回答：
run npx babel-upgrade
(然后您可以在package.json中查看更改的内容)
长答案
对于RN0.57.x，在阅读了babel和babel升级文档之后，我意识到在我的项目的devDependencies中拥有所有旧的babel依赖项就足够了：
"dependencies": {
.........
"react": "16.3.1",
"react-native": "0.55.4",
},
"devDependencies": {
"babel-plugin-transform-runtime": "^6.23.0",
"babel-preset-latest": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babel-register": "^6.24.1",
"react-native": "0.55.4",
"babel-eslint": "^8.2.2",
"babel-plugin-syntax-object-rest-spread": "^6.13.0",
"babel-plugin-transform-object-rest-spread": "^6.23.0",
"babel-preset-react-native": "^4.0.0",
"babel-preset-react-native-stage-0": "^1.0.1",
.....
},1) I使用了npx和babel-upgrade (npx已经包含在npm版本>= 5.2.0中)，如果您有较旧的npm版本，则必须全局安装npx。
npx允许您运行babel-upgrade，而无需在本地安装它。
2)我运行了npx babel-upgrade (没有--write option)，以查看升级将如何影响到我的package.json设备)
3)我运行了npx babel-upgrade --write
4)我将RN版本设置为0.57.1，并将babel-预设依赖项从"babel-preset-react-native": "^5"、"metro-react-native-babel-preset": "^0.45.0"和.babelrc配置更改为：
{
"presets": ["module:metro-react-native-babel-preset"]
}如RN更改日志指令中所写。
现在，package.json看起来如下：
"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",
.....
}我不确定是否需要gradle-upgrade添加的所有新的依赖项，但该项目为android和ios构建并运行良好。
如果您为这个babel更新找到了更好的解决方案或改进，请添加一个评论或添加一个新的答案，我将乐意更新我的答案或接受一个新的更好的答案。
资料来源：
https://github.com/react-native-community/react-native-releases/blob/master/CHANGELOG.md#057
https://github.com/babel/babel-upgrade
对于RN0.58.6，我注意到我不需要那么多的babel deps。我注意到这创建了一个新项目，其中包含了一个react本机init命令。
我的package.json文件现在如下所示：
{
"dependencies": {
"react": "16.6.3",
"react-native": "0.58.6",
// ....
},
"devDependencies": {
"@babel/core": "^7.0.0-0",
"babel-core": "^7.0.0-bridge.0",
"babel-eslint": "^10.0.1",
"babel-jest": "24.1.0",
"jest": "24.1.0",
"metro-react-native-babel-preset": "0.53.0",
"react-test-renderer": "16.6.3",
// ....
},
"jest": {
"preset": "react-native",
// ...
}
}注意： For IOS:我可以在IOS中构建它，而不需要pod文件中的任何react/react-native deps。我在链接框架和库部分中添加了/重新添加了这些
Stack Overflow用户
发布于 2019-03-19 18:52:27
使用babel-upgrade。
您可以尝试使用babel-upgrade来自动升级Babel依赖项。
它非常容易使用，即使没有在全球安装它。
我建议使用一个干净的工作目录(没有未分阶段的更改)，只需运行以下命令：
npx babel-upgrade --write这将用正确的Babel版本和包更新package.json和.babelrc文件。
--write命令只是告诉工具将更改保存到磁盘。这就是为什么我建议拥有一个干净的工作目录，这样您就可以使用git diff查看更改。如果您省略了--write，它只会在控制台中显示所需的更改。
您可以在https://github.com/babel/babel-upgrade上看到更多信息。
Stack Overflow用户
发布于 2021-03-17 18:22:51
对于2021年有此问题的任何人: npm安装
https://stackoverflow.com/questions/52681984
复制相似问题
腾讯云开发者
