使用React-Native运行自定义Babel变换

Question

我需要使用babel-plugin-transform-decorators-legacy和React-Native来启用@decorators。如何配置React-Native / Babel使其成为可能？

这与我之前关于如何让@decorators在React-Native中工作的问题有关：https://stackoverflow.com/a/34271636/941058

Answer 1

使用官方Babel预设

安装官方Babel presets for React Native applications：

npm i babel-preset-react-native --save-dev

修改您的.babelrc：

{
  "presets": ["react-native"]
}

Prior RN v21.0：从react-native

扩展原始.babelrc

为避免操纵node_modules目录中的文件，您应该extend原始.babelrc。

通过保持您的依赖关系清洁，升级或共享项目不会出现任何问题。

{
    "extends": "react-native/packager/react-packager/.babelrc",
}

Answer 2

您可以在项目根级别安装插件，然后将插件添加到node_modules / react-native / packager / react-packager / .babelrc中的.babelrc

使用@decorators这项工作的问题是，如果您正在为应用程序开发团队，每个开发人员都需要对.babelrc进行更改，因为不应将node_modules检入源代码。

Answer 3

自2016年1月起，您只需在.babelrc和index.ios.js附近创建index.android.js文件即可：

{
  "plugins": [
    "transform-decorators"
  ]
}

Answer 4

您必须将它添加到node_modules文件夹的react native文件夹中的.babelrc。

此文件： 反应天然/打包器/反应-打包器/ .babelrc。

将它放在syntax-class-properties之前。

您似乎也需要根级别的.babelrc，如下所示。

    {
      "plugins": [
        "transform-decorators"
      ]
    }