6

当我使用 React-Native 默认打包程序启动我的项目时,我有这个错误:Unexpected token在这一行:

static propTypes = {
   /// ...
};

我在 GitHub 上查看了 React-Native 问题,但没有找到解决方案。

有什么建议吗?

4

6 回答 6

7

React-Native 打包器使用 Babel 传输 ES6 和 ES7,但不是所有功能。启用列表在这里。在您的情况下,默认情况下,RN 打包程序中未启用class-props 。您可以在打包程序之前使用 Babel 编译您的代码,或者只是在打包程序设置中启用它。有关更多信息,请参阅此官方文档

于 2015-11-10T02:16:13.463 回答
4

尝试将您的 propTypes 附加到您的课程中:

var MyClass extends React.Component {
....
}

MyClass.propTypes = {
.... /* enter proptypes here */
}
于 2015-11-09T19:06:37.727 回答
3

根据这个答案,您需要从 Babel 6 开始为类属性安装一个插件。

从 Babel 6 开始,您现在需要transform-class-properties插件来支持类属性。

脚步:

  1. 运行这个:npm install babel-plugin-transform-class-properties
  2. 将此添加到您的 .babelrc 中:("plugins": ["transform-class-properties"] 注意,它是一个插件,而不是转换;所以不要将它放在“预设”列表中。)

为我工作。

于 2016-03-20T07:59:35.237 回答
3

在@Fomahaut 回答之后,我一直在查看 Facebook 的 GitHub 存储库并发现了这个问题:https ://github.com/facebook/react-native/issues/2182

  • 在项目的根目录下创建一个 .babelrc 文件
  • 向 Babel 添加更多规则

例子:

    {
      "retainLines": true,
      "compact": true,
      "comments": false,
      "whitelist": [
        "es6.arrowFunctions",
        "es6.blockScoping",
        "es6.classes",
        "es6.constants",
        "es6.destructuring",
        "es6.forOf",
        "es6.modules",
        "es6.parameters",
        "es6.properties.computed",
        "es6.properties.shorthand",
        "es6.spread",
        "es6.tailCall",
        "es6.templateLiterals",
        "es6.regex.unicode",
        "es6.regex.sticky",
        "es7.asyncFunctions",
        "es7.classProperties",
        "es7.comprehensions",
        "es7.decorators",
        "es7.exponentiationOperator",
        "es7.exportExtensions",
        "es7.functionBind",
        "es7.objectRestSpread",
        "es7.trailingFunctionCommas",
        "regenerator",
        "flow",
        "react",
        "react.displayName"
        ],
      "sourceMaps": false
    }
于 2015-11-10T09:19:54.520 回答
1

安装stage-0 Babel preset ( npm i --save-dev babel-preset-stage-0) 并将其添加到.babelrc文件presets部分,例如:

{ "presets": ["react", "es2015", "babel-preset-stage-0"] }
于 2016-01-28T05:19:14.980 回答
0

看看是否有帮助:

  1. $ npm install babel-plugin-transform-decorators
  2. 导航/<your project root>/node_modules/react-native/packager/react-packager/.babelrc
  3. 添加"transform-decorators"到此列表:

    { "retainLines": true, "compact": true, "comments": false, "plugins": [ "syntax-async-functions", "syntax-class-properties", "syntax-trailing-function-commas", "transform-class-properties", "transform-es2015-arrow-functions", "transform-es2015-block-scoping", "transform-es2015-classes", "transform-es2015-computed-properties", "transform-es2015-constants", "transform-es2015-destructuring", ["transform-es2015-modules-commonjs", {"strict": false, "allowTopLevelThis": true}], "transform-es2015-parameters", "transform-es2015-shorthand-properties", "transform-es2015-spread", "transform-es2015-template-literals", "transform-flow-strip-types", "transform-object-assign", "transform-object-rest-spread", "transform-react-display-name", "transform-react-jsx", "transform-regenerator", "transform-es2015-for-of", -->"**transform-decorators**"<-- ], "sourceMaps": false }

于 2016-05-07T01:58:29.377 回答