React-Native, BleManager "Native Module cannot be null"

user_8736770 0
Viewed 2648

I wanted to try out the react-native-ble-plx library from Polidea

https://github.com/Polidea/react-native-ble-plx

So I created a new app in terminal and installed the library as explained by Polidea

create-react-native-app playground

npm install --save react-native-ble-plx

react-native link react-native-ble-plx

I then ran npm start and then i (for opening in iOS simulator)

and then I got the following error (in the terminal and in the simulator)

  • Native module cannot be null
  • node_modules/react-native/node_modules/fbjs/lib/invariant.js:44:24 in invariant
  • node_modules/react-native/Libraries/EventEmitter/NativeEventEmitter.js:31:16 in NativeEventEmitter
  • node_modules/react-native-ble-plx/src/BleManager.js:52:25 in BleManager
  • App.js:8:19 in App
  • node_modules/react-native/Libraries/Renderer/ReactNativeStack-dev.js:1679:33 in
  • node_modules/react-native/Libraries/Renderer/ReactNativeStack-dev.js:1610:15 in measureLifeCyclePerf
  • ... 52 more stack frames from framework internals

Here is the code in App.js:

import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import {BleManager} from 'react-native-ble-plx';

//importing BleManager without calling new BleManager() works

export default class App extends React.Component {
  constructor(){
    super();
    this.manager = new BleManager();
  }

  //calling new BleManager() leads to error

  render() {
    return (
      <View style={styles.container}>
        <Text>nothing, just sucking errors</Text>
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
});

Here is the file package.json

{
  "name": "playground",
  "version": "0.1.0",
  "private": true,
  "devDependencies": {
    "react-native-scripts": "1.5.0",
    "jest-expo": "^21.0.2",
    "react-test-renderer": "16.0.0-alpha.12"
  },
  "main": "./node_modules/react-native-scripts/build/bin/crna-entry.js",
  "scripts": {
    "start": "react-native-scripts start",
    "eject": "react-native-scripts eject",
    "android": "react-native-scripts android",
    "ios": "react-native-scripts ios",
    "test": "node node_modules/jest/bin/jest.js --watch"
  },
  "jest": {
    "preset": "jest-expo"
  },
  "dependencies": {
    "expo": "^21.0.0",
    "react": "16.0.0-alpha.12",
    "react-native": "^0.48.4",
    "react-native-ble-plx": "^0.6.3"
  }
}

I already looked for help and tried

 npm -rm rf node_modules
 npm install

but it didn't help.

Here is my system information:

macOS High Sierra

iMac (27-inch, Mid 2010)

Processor 2.8 GHz Intel Core i5

Memory 16 GB 1333 MHz DDR3

I also got the same error when opening the app in my iPhone(6s, 10.3.1) (after scanning QR code in terminal from npm start)

Other apps without the react-native-ble-plx library work normally.

Looking forward receiving some help.
Thanks in advance.
Frank

bluetooth-lowenergy expo react-native
2 Answers

You have used create-react-native-app to create your React Native project. So you can not use react-native-ble-plx library with this project. Because to access Bluetooth hardware, react-native-ble-plx package has some native code written in android and ios seperately.

If you want to build your app, you'll need to eject from create-react-native-app and use Xcode and Android Studio.

Use the below command:--

npm install -g react-native-cli
npm run eject
react-native link react-native-ble-plx
  • 1st command is to install react-native-cli globally
  • 2nd command is to convert your project from Expo project to regular React Native project
  • 3rd command is to link react-native-ble-plx. Because most probably your previous link was failed.
user_32898410

What I did was (after completely removing ble-plx by discarding git changes before I started)

navigating to /node_modules/react-native-ble-plx/ios/BleClient.xcodeproj and

  1. I pulled that into the Libraries folder in the project navigator
  2. Then I went to my target -> build phases -> link binary with libraries and added libBleClient.a
user_85124990
Related