Nativebase: Undefined is not an object (evaluating '_reactNative.ViewPropTypes.style')

Created on 23 May 2017 · 40Comments · Source: GeekyAnts/NativeBase

Hi, I have an issue with the latest version of nativeBase.

I'm trying just to add an example in my Application.

import { AppRegistry } from 'react-native'
import React, { Component } from 'react';
import { Container, Header, Title, Content, Footer, FooterTab, Button, Left, Right, Body, Icon } from 'native-base';
export default class AnatomyExample extends Component {
    render() {
        return (
            <Container>
                <Header>
                    <Left>
                        <Button transparent>
                            <Icon name='menu' />
                        </Button>
                    </Left>
                    <Body>
                        <Title>Header</Title>
                    </Body>
                    <Right />
                </Header>
                <Content>
                    // Your main content goes here
                </Content>
                <Footer>
                    <FooterTab>
                        <Button full>
                            <Text>Footer</Text>
                        </Button>
                    </FooterTab>
                </Footer>
            </Container>
        );
    }
}


AppRegistry.registerComponent('myApp', () => AnatomyExample)

My package.json:

{
  "name": "myApp",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest"
  },
  "dependencies": {
    "lodash": "^4.17.4",
    "native-base": "^2.1.4",
    "react": "16.0.0-alpha.6",
    "react-native": "0.43.4",
    "react-native-camera": "git+https://github.com/lwansbrough/react-native-camera.git",
    "react-native-vector-icons": "^4.1.1",
    "react-navigation": "^1.0.0-beta.9"
  },
  "devDependencies": {
    "babel-jest": "19.0.0",
    "babel-preset-react-native": "1.9.1",
    "jest": "19.0.2",
    "react-test-renderer": "16.0.0-alpha.6"
  },
  "jest": {
    "preset": "react-native"
  }
}

I'v tried to delete node_modules, cache clean, npm install, not working.

Thanks,

Source

Tsouef

👍17

Most helpful comment

@wellmonge thank you! My problem was that in my package.json I was doing:

"react-native-router-flux": "^3.37.0"

But that actually fetches the most recent 3.x.x version. Setting the package version explicitly with:

"react-native-router-flux": "3.37.0"

Solved my problem.

imcbv on 30 May 2017

👍19 ❤4 🎉4 🚀1

All 40 comments

same

dopey2 on 23 May 2017

@Tsouef @Dani93380 works perfect for me, try to update react-native package to 0.44.0

RakhmatovR on 23 May 2017

👍3

@Tsouef @Dani93380 View.propTypes is deprecated and instead ViewPropTypes is used from RN44, which is introduced in the latest version of NativeBase as well. So For RN44 go for NativeBase v2.1.4 and anything below RN44, you can use NB v2.1.3

shivrajkumar on 23 May 2017

👍12

Thanks, It's working !

Tsouef on 23 May 2017

👍2

I'm using RN38 and NB 2.1.3 and still facing this issue, so frustrating... what should I do?

brascene on 29 May 2017

"native-base": "2.1.4",
"react": "16.0.0-alpha.6",
"react-native": "0.44.0",

works for me
Also tried this with RNRF 3.39.2, got it running

SupriyaKalghatgi on 30 May 2017

👍1

@shivrajkumar i can't upgrade to 0.44.0 because of other dependencies and I'm on

    "native-base": "2.1.0",
    "react": "15.4.1",
    "react-native": "0.42.3",

but nothing working so far even with older native-base versions

matthiasprieth on 30 May 2017

👍3

I upgrade react-native-router-flux 3.39.0 and get this error, with a simple roll back to version 3.37.0 it works. Could be some related with -v3.39.0 .

wellmonge on 30 May 2017

👍4

@wellmonge thank you! My problem was that in my package.json I was doing:

"react-native-router-flux": "^3.37.0"

But that actually fetches the most recent 3.x.x version. Setting the package version explicitly with:

"react-native-router-flux": "3.37.0"

Solved my problem.

imcbv on 30 May 2017

👍19 ❤4 🎉4 🚀1

[email protected]
"react-native": "^0.42.3"
"react": "^15.4.1"
"react-native-router-flux": "3.37.0"

Solved It For ME

lancebailey79 on 31 May 2017

@matthiasprieth In that case, try using older version of RNRF
May be you can check the compatibility versions pf React Native and RNRF

SupriyaKalghatgi on 31 May 2017

@wellmonge I got my app running with the latest version of React Native, NativeBase and RNRF
Check my comment

SupriyaKalghatgi on 31 May 2017

@matthiasprieth With the versions specified by you, try installing 3.37.0 of RNRF

SupriyaKalghatgi on 31 May 2017

@SupriyaKalghatgi thx i got it working by switching to version

    "react": "~15.4.1",
    "react-native": "0.42.0",

and putting

    configurations.all {
        resolutionStrategy {
         eachDependency { DependencyResolveDetails details ->
           if (details.requested.group == 'com.facebook.react' && details.requested.name == 'react-native') {
             details.useVersion "0.42.0" // Your React Native version here
           }
         }
        }
    }

in build.gradle. So i think for me it had nothing to do with RNRF. And for the code in build.gradle there is also a dynamic approach on the web, where you don't have to put your react version in it, but i couldn't find it anymore.

matthiasprieth on 31 May 2017

Good to know that you got it working.

SupriyaKalghatgi on 31 May 2017

I'm using nativebase 2.1.4 and react-native 44.2.0 and still get this issue. any fix?

Talor-A on 3 Jun 2017

For the life of me, I can't solve this issue. I've tried countless different variations of versions for React, RN, RNRF, as well as clearing caches.

Is there anything else that has been effective that I could be missing?