[0.25.1] Unfocussed Warning Yellowbox

[GantMan]

Using Mac, RN 0.25.1, problem occurs on iOS and Android. After upgrading to 0.25.1 I get the warning that ReactNative.createElement is deprecated. I have scanned every file I use and I do not use the deprecated ReactNative.createElement. Is it possible that this error is coming from node_modules? I can't see how I'd get it any other way. If so, it shouldn't be alerting me about node_modules using deprecated syntax right? Or at the least, can this give me a line number/file? I have nothing to go on for fixing this warning.

https://github.com/infinitered/ignite/tree/master/ignite-base
createElement is used once, and comes from react as warning wants. Still get warning.

[kraffslol]

This might have to do with the new deprecation in RN 0.25. Look at the deprecations part on https://github.com/facebook/react-native/releases/tag/v0.25.1

[ide]

grep through all your node_modules for createElement calls and see which ones are getting imported from react-native instead of react.

[GantMan]

I did a preliminary pass, and did not find anything.

I also ran $ grep -r -l react-native node_modules | xargs grep -l createElement which did not turn up anything worth mentioning. I'm interested if anyone else is getting this warning.

I'm proud of running a warning free dev environment, but I really can't crack this one.

[magicismight]

This is very very annoying.
Do I have to change EVERY module I have used in my project to keep off this warning?

[satya164]

@GantMan You most probably don't use createElement directly. <SomeComponent /> is transpiled to React.createElement calls.

[satya164]

Also read the release notes for examples - https://github.com/facebook/react-native/releases

[grabbou]

You can hide this warning which might be another option. There's an open issue already for stack traces you can track here - #5834.

@GantMan you should look for import React..... from 'react-native' or `import ... { Component } from 'react-native'``.

I believe it's good to see the warnings coming from node_modules, otherwise your app may unexpectedly break when upgrading to the newer version.

I am thinking we can close this and move to the linked issue above for working on the better stack traces (or at least a file that caused the warning)

[GantMan]

@grabbou - I agree, I too would enjoy seeing a warning from node_modules, but only if I KNEW it was from node_modules. This needle in a haystack warning starts to ebb at sanity.

I've researched my node_modules to try to find nothing, and if what @satya164 is saying, that it might be coming from something transpiled, I'm a bit at a loss on how I'm supposed to rebuff this warning at all.

I guess this ticket really does tie in on #5834, since what I ultimately want is a way forward to squash the warning. Feel free to close this ticket in favor of 5834. We can reopen if needed.

[ide]

You could turn off the YellowBox warning if it annoys you.

[GantMan]

@ide - yes, I could, but that's a really not a solution. YellowBox notifications are great! and useful 99% of the time, it's only this one which isn't. Every other YellowBox warning is usually findable and fixable by removing deprecated code.

I'm afraid of turning off YellowBox and losing the useful feedback it was designed to provide.

[chirag04]

@GantMan you can selectively ignore warning that you don't like using:

console.ignoredYellowBox = ['Warning: ...'];

[Jiafan]

I solved it like this .

import React, { Component } from 'react';

import { StyleSheet,TouchableHighlight,Text } from 'react-native';

Just do what the warning telling us to do.

[agat]

Hello i have similar error. react 0.14.8, react-native 0.25.1

ExceptionsManager.js:76 Warning: ReactNative.Component is deprecated. Use React.Component from the "react" package instead. in Chrome console.

You can reproduce this with minimal code:

index.ios.js

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

class App extends Component {
    render () {
        return (
            <Text>{'Hello'}</Text>
        );
    };
};

const app = () => {
    AppRegistry.registerComponent('pn', () => App);
}

app('ios');

[michelmongkhoy]

Hi,

I got the same issue.
Looks like, when lazy developer like me are copy/pasting the code from this page, you got this issue.

By chance, if you check the markdown on GitHub, you have a working code that doesn't make the warning.

You can check the differences to see what you need to do.
Might be helpful to update the website so others can avoid this problem 😄

Working code below:

'use strict';

import React from 'react';
import {
  AppRegistry,
  StyleSheet,
  Text,
  View
} from 'react-native';

var styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: 'red'
  }
});

class SimpleApp extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <Text>This is a simple application.</Text>
      </View>
    )
  }
}

AppRegistry.registerComponent('SimpleApp', () => SimpleApp);

[rclai]

FYI, if you guys have been using react-redux@3.x, you will get this warning. Just upgrade to the latest react-redux, change this

import { connect } from 'react-redux/native';

to

import { connect } from 'react-redux';

, and the warning should disappear.

It looks like you won't get that fbjs error of death anymore (in 0.25.1 AFAIK).

[GantMan]

Greetings all, I spent a good amount of time today trying to remove this yellowbox issue. I searched through all node_modules for .*React .*['|"]react-native and edited the files in place when any node_module used the older syntax. I STILL have a warning, and I can't identify where/how to fix this.

[jeromegrosse]

So did I. Could it be that Babel 'translates' some import into the deprecated code? Is there any way to read the code generated by babel?

[GantMan]

FINALLY got all my warnings gone! PHEW did updating of dependencies, and fortunately all libs seem to have cleared themselves of this mess :)

gotta admit I was worried, but fortunately the libs I depend on have updated.

[grabbou]

Great to hear that! I can also see this improving which makes me happy as the 0.26 is waiting for the upgrade :)

Can we close this now or is there anything to add?

[GantMan]

Yup! Good to run a clear project again!