react-native无法读取null的属性"绑定"

管原秀*_*原秀太 21 react-native

我试图运行一个反应本机模拟器.

但是,这个错误在模拟器中出现了:

Failed to load bundle(http://localhost:8081/index.bundle?
platform=ios&dev=true&minify=false) 
with error:(/Users/sugawarasyuta/Desktop/albums/index.js:
Cannot read property 'bindings' of null(null))
Run Code Online (Sandbox Code Playgroud)

我仔细检查了我的代码语法.但我觉得这不是那个.你知道如何解决这个错误吗?

这是我的文件:

index.js

import React from 'react';
import { AppRegistry,View } from 'react-native';
import Header from './src/components/header';
import AlbumList from './src/components/AlbumList';


//Create a component
const App = () => (
<View>
<Header headerText= {'albums'} />
<AlbumList />
</View>
);

AppRegistry.registerComponent('albums', () => App );
Run Code Online (Sandbox Code Playgroud)

AlbumList.js

import React,{Component}from 'react';
import {View, Text} from 'react-native';
import axios from 'axios';

class AlbumList extends Component {

componentWillMount(){
    axios.get('https://rallycoding.herokuapp.com/api/music_albums')
    .then(response => console.log(response));

}
render(){
return(
    <View>
        <Text>AlbumList!!!</Text>
    </View>
    );
}
}
export default AlbumList;
Run Code Online (Sandbox Code Playgroud)

这些是最终陈述:

/usr/bin/codesign --force --sign - --entitlements /Users/sugawarasyuta/Desktop/albums/ios/build/Build/Intermediates.noindex/albums.build/Debug-iphonesimulator/albums.build/albums.app.xcent --timestamp=none /Users/sugawarasyuta/Desktop/albums/ios/build/Build/Products/Debug-iphonesimulator/albums.app

/Users/sugawarasyuta/Desktop/albums/ios/build/Build/Products/Debug-iphonesimulator/albums.app: resource fork, Finder information, or similar detritus not allowed

Command /usr/bin/codesign failed with exit code 1



** BUILD FAILED **


The following build commands failed:

    CodeSign build/Build/Products/Debug-iphonesimulator/albums.app
(1 failure)

Installing build/Build/Products/Debug-iphonesimulator/albums.app
Launching org.reactjs.native.example.albums
org.reactjs.native.example.albums: 8385
Run Code Online (Sandbox Code Playgroud)

这是我的package.json.这些依赖是否正确?

{
"name": "albums",  
"version": "0.0.1",

"private": true,

"scripts": {
 "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },


  "dependencies": {

"axios": "^0.18.0",

"babel-plugin-transform-es2015-arrow-functions": "^6.22.0",

"react": "16.3.1",

"react-native": "^0.56.0"

 },

"devDependencies": {

"@babel/preset-env": "^7.0.0-beta.53",

"babel-jest": "23.0.1",

"babel-preset-es2015": "^6.24.1",

 "babel-preset-react-native": "4.0.0",

"eslint-config-rallycoding": "^3.2.0",

 "jest": "23.1.0",

"react-test-renderer": "16.3.1"

},

"jest": {

 "preset": "react-native"

 }

}
Run Code Online (Sandbox Code Playgroud)

我升级"babel-preset-react-native""4.0.0""^5.0.1"和其他错误就出来了:

error: bundling failed: SyntaxError: 
/Users/sugawarasyuta/Desktop/albums/index.js: Unexpected token (11:3)



  10 | const App = () => {

> 11 |    <Header headerText= {'albums'} />

     |    ^

  12 | 

  13 | };



at Parser.raise

(/Users/sugawarasyuta/Desktop/albums/node_modules
/@babel/core/node_modules/babylon/lib/index.js:776:15)

at Parser.unexpected    
(/Users/sugawarasyuta/Desktop/albums/node_modules/
@babel/core/node_modules/babylon/lib/index.js:2079:16)

at Parser.parseExprAtom (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:3157:20)

at Parser.parseExprSubscripts (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:2757:21)

at Parser.parseMaybeUnary (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:2736:21)

at Parser.parseExprOps (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:2643:21)

at Parser.parseMaybeConditional (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:2615:21)

at Parser.parseMaybeAssign (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:2562:21)

at Parser.parseExpression (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:2515:21)

at Parser.parseStatementContent (/Users/sugawarasyuta/Desktop/albums/node_modules/@babel/core/node_modules/babylon/lib/index.js:4076:21)
 BUNDLE  [ios, dev] ../../index.js ???????????????? 0.0% (0/1), failed.
Run Code Online (Sandbox Code Playgroud)

我觉得这不是因为语法错误,而是因为依赖的原因.你知道我怎么解决它?

小智 31

没有任何进一步的信息,我怀疑你需要更新babel-preset-react-native.

升级到0.56时,请确保将babel-preset-react-native package.json依赖项添加到^ 5.0.1或更高版本.

https://github.com/facebook/react-native/releases


Ron*_*eau 13

对于React Native 0.57

升级到React Native 0.57时,请按照下列步骤操作以解决此问题:

  1. 将React的版本升级package.json到16.5

  2. 将babel预设依赖项更改"babel-preset-react-native": "^5""metro-react-native-babel-preset": "^0.45.0"

  3. .babelrc配置更改为:

    {
      "presets": ["module:metro-react-native-babel-preset"]
    }
    
    Run Code Online (Sandbox Code Playgroud)
  4. 运行rm -rf node_modules/以删除旧模块

  5. 跑来npm install获得新鲜感node_modules/

  6. 运行react-native upgrade以升级配置文件

  7. 运行rm -rf android/build/ ios/build/以摆脱旧的编译应用程序

  8. 再次运行你的应用程序,它应该工作!

第一步的来源