react-native-orientation: Bug: undefined is not an object (evaluating 'Orientation.lockToPortrait')

Hello!

I’m trying to lock my application orientation. And I have some problems…

Here are the steps I’ve followed as I don’t wan’t to eject my application:

First, install…

$ npm install react-native-orientation --save
mobile@0.1.0 /Users/shudrum/www/Shudrum/mobile
└── react-native-orientation@2.1.0 

npm WARN lottie-react-native@1.1.1 requires a peer of react@>=15.3.1 but none was installed.
npm WARN react-native-branch@2.0.0-beta.3 requires a peer of react@>=15.4.0 but none was installed.
$

Then the link:

$ react-native link react-native-orientation
Scanning 718 folders for symlinks in /Users/shudrum/www/Shudrum/mobile/node_modules (5ms)
$

Finally, here is the simple usage:

import React, { Component } from 'react';
import Orientation from 'react-native-orientation';
import { StyleSheet, View, ScrollView } from 'react-native';
import PageLogin from './Page/Login';

export default class MyApp extends Component {
  componentWillMount() {
    Orientation.lockToPortrait();
  }
  render() {
    return (
      <View>
        <ScrollView scrollEnabled={false} contentContainerStyle={style.scroll}>
          <PageLogin />
        </ScrollView>
      </View>
    );
  }
}

And nope … I still get this error: undefined is not an object (evaluating ‘Orientation.lockToPortrait’)

This is the first time I link a package, maybe the link have failed?

For more information:

  • Node version: 8.1.2
  • Npm version: 4.6.1 (as we still cannot use the v5 for the CLI)
  • React Native CLI version : 0.46.4

If I can help, I will!

Thank you!

And finally the complete (useless?) stack:

undefined is not an object (evaluating 'Orientation.lockToPortrait')

lockToPortrait
    index.js:39:16
componentWillMount
    App.js:8:4
measureLifeCyclePerf
    ReactNativeStack-dev.js:1625:15
mountComponent
    ReactNativeStack-dev.js:1666:57
mountComponent
    ReactNativeStack-dev.js:1331:53
mountChildren
    ReactNativeStack-dev.js:2831:62
initializeChildren
    ReactNativeStack-dev.js:2900:45
mountComponent
    ReactNativeStack-dev.js:2929:84
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
mountChildren
    ReactNativeStack-dev.js:2831:62
initializeChildren
    ReactNativeStack-dev.js:2900:45
mountComponent
    ReactNativeStack-dev.js:2929:84
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
mountChildren
    ReactNativeStack-dev.js:2831:62
initializeChildren
    ReactNativeStack-dev.js:2900:45
mountComponent
    ReactNativeStack-dev.js:2929:84
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
mountChildren
    ReactNativeStack-dev.js:2831:62
initializeChildren
    ReactNativeStack-dev.js:2900:45
mountComponent
    ReactNativeStack-dev.js:2929:84
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
performInitialMount
    ReactNativeStack-dev.js:1718:54
mountComponent
    ReactNativeStack-dev.js:1670:184
mountComponent
    ReactNativeStack-dev.js:1331:53
mountComponentIntoNode
    ReactNativeStack-dev.js:2027:50
perform
    ReactNativeStack-dev.js:1391:99
batchedMountComponentIntoNode
    ReactNativeStack-dev.js:2033:24
perform
    ReactNativeStack-dev.js:1391:99
renderComponent
    ReactNativeStack-dev.js:2061:45
renderApplication
    renderApplication.js:34:4
runApplication
    AppRegistry.js:183:26
__callFunction
    MessageQueue.js:260:47
<unknown>
    MessageQueue.js:101:26
__guard
    MessageQueue.js:228:6
callFunctionReturnFlushedQueue
    MessageQueue.js:100:17

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Comments: 25 (2 by maintainers)

Most upvoted comments

For me the problem was after I changed the config in XCode, I did not rebuild from Xcode again. After rebuilding, it is working fine.

@Shudrum I haven’t built React Native applications using CRNA. It’s great for small prototypes and all but when dealing with a large application I like to be in control of all of the aspects of my application. That being said, I don’t believe you can use native-modules with CRNA. It uses Expo’s SDK and to allow for use with this package you’d need to eject it. Read more on @skevy’s answer here: https://github.com/airbnb/native-navigation/issues/49#issuecomment-286900613