React Native-升级0.56错误[编辑]

时间:2018-07-09 14:17:20

标签: react-native mobx mobx-react

我正在尝试将mobx集成到我的react native应用程序中,但是我认为有一些问题是因为0.56 react native-update。当我使用store-prop或@ observer-decorator时,会发生错误(请参见下面的代码)。

错误提示:_$$_REQUIRE(..) is not a function

我安装了最新的react native(0.56),并且已经安装了Babel Core 7(Beta 47)。 我也有“ @ babel / plugin-proposal-decorators”(v7,Beta 47)。我还测试了安装:“ @ babel / plugin-transform-runtime”(v7,Beta 47)。首先,我安装了babel core beta版本52,但这给了我这个错误:

Property right of AssignmentExpression expected node to be of a type ["Expression"] but instead got null

在进行一些搜索之后,它看起来似乎需要beta版本47,因此我安装了它,并且看起来像在运行,直到将装饰器重新添加到代码中为止。然后我收到“ Require”错误。 我在StackOverflow或其他任何地方都找不到有关此错误的信息。

没有缺少的peerDependencies。

这是我的package.js:

"dependencies": {
    "adm-zip": "^0.4.11",
    "mobx": "^5.0.3",
    "mobx-react": "^5.2.3",
    "plist": "^3.0.1",
    "react": "^16.4.1",
    "react-native": "^0.56.0",
    "react-native-elements": "^0.19.1",
    "react-native-fbsdk": "^0.7.0",
    "react-native-fontawesome": "^5.7.0",
    "react-native-vector-icons": "^4.6.0",
    "react-navigation": "^2.3.1",
    "xcode": "^1.0.0"
  },
  "devDependencies": {
    "@babel/cli": "^7.0.0-beta.47",
    "@babel/core": "^7.0.0-beta.47",
    "@babel/plugin-external-helpers": "^7.0.0-beta.47",
    "@babel/plugin-proposal-class-properties": "^7.0.0-beta.47",
    "@babel/plugin-proposal-decorators": "^7.0.0-beta.47",
    "@babel/plugin-proposal-optional-chaining": "^7.0.0-beta.47",
    "@babel/plugin-syntax-typescript": "^7.0.0-beta.47",
    "@babel/plugin-transform-arrow-functions": "^7.0.0-beta.47",
    "@babel/plugin-transform-classes": "^7.0.0-beta.47",
    "@babel/plugin-transform-runtime": "^7.0.0-beta.47",
    "@babel/preset-env": "^7.0.0-beta.47",
    "@babel/preset-react": "^7.0.0-beta.47",
    "@babel/runtime": "^7.0.0-beta.47",
    "babel-cli": "^6.26.0",
    "babel-jest": "23.0.1",
    "babel-plugin-transform-class-properties": "^6.24.1",
    "babel-plugin-transform-decorators-legacy": "^1.3.4",
    "babel-preset-react": "^6.24.1",
    "babel-preset-react-native": "^5.0.2",
    "babel-preset-react-native-typescript": "^1.0.0-rc.1",
    "jest": "23.1.0",
    "react-test-renderer": "16.3.1"
  },
  "jest": {
    "preset": "react-native"
  },

.babelrc:

{
  "presets": ["react-native-typescript", "@babel/preset-env", "@babel/preset-react" ],
  "plugins": [
    [
    "transform-class-properties", { "loose": true },
    ],
    ["@babel/plugin-proposal-decorators", { "legacy": true }],
    ["@babel/plugin-transform-runtime", {
      "helpers": true,
      "polyfill": false,
      "regenerator": false
    }]
  ]
}

这是商店:

import { observable } from 'mobx';

export class UserStore {
  @observable test = 2;
}

这是使用商店的组件:

import { observer } from 'mobx-react';
import store from './../mobx/UserStore'

@observer
class NavMenu extends React.Component {
  constructor(props) {
    super(props);
    this.state = {   
    };
  }
  render() {
    const { userStore } = this.props;
    return (
      <View style={{flex: 1}}>
        {userStore.test}
      </View>
    );
  }
}

所以当我使用store-prop或@ observer-decorator时出现错误。 @ observable-decorator在商店中工作正常。

编辑: 事实证明,这并不是因为黑帮。在我完成npm install并更新了react native版本之后,缺少了一些东西/错误了。我实际上无法编辑任何组件。编辑它们后,我会遇到某种错误。 “需要”错误就是其中之一。 “ _typeof不是函数”也是我现在看到的错误。请帮助,我目前无法使用我的应用执行任何操作。我的包裹中有什么不对吗?

1 个答案:

答案 0 :(得分:0)

使用这些版本更新您的依赖项。

在package.json中设置依赖项

{
  "name": "mobxdemo",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "lodash": "^4.17.10",
    "prop-types": "^15.6.1",
    "mobx": "^5.0.3",
    "mobx-react": "^5.2.3",
    "mobx-state-tree": "^3.0.0",
    "react": "16.3.2",
    "react-native": "^0.55",
    "react-navigation": "2.2.5"
  },
  "devDependencies": {
    "babel-core": "6.26.0",
    "babel-eslint": "^8.2.5",
    "babel-jest": "22.4.3",
    "babel-plugin-transform-decorators-legacy": "^1.3.5",
    "babel-preset-react-native": "^3.0.2",
    "jest": "22.4.3",
    "react-test-renderer": "16.4.1"
  },
  "jest": {
    "preset": "react-native",
    "plugins": [
      "transform-decorators-legacy"
    ]
  }
}

设置为.babelrc

{
  "presets": ["react-native"],
  "plugins": ["transform-decorators-legacy"]
}