React-native "Attempted to assign to readonly property"

Question

How I got where I am(you can skip to next paragraph)

Recently I picked up react-native for mobile development and it was hell, spent 3 hours googling solutions why isn't my react-native init project even run, after downgrading a couple of packages I was able to run this blank app fine, but soon after, I was still receiving errors that didn't seem to be even from my code.. So 3 days into development and chill where I have seen nothing more, but various errors and I didn't progress with the app at all.

My latest issue I can't solve for quite some time:

So the error I am getting is "Attempted to assign to readonly property". Now the stack trace always points to node_modules/../ReactNativeRenderer-dev.js

this is my code that has almost nothing in it and still reproduces the issue

import React, {Component} from 'react';
import {Platform, StyleSheet, Text, View, Button} from 'react-native';
import { createStackNavigator} from 'react-navigation';
// routes
//import HeaderComp from './src/components/headerComp';
//import NavigatorDiv from './src/router';

class Home extends React.Component{
  render() {
    return <Text> hello this is home </Text>
  }
}

class List extends React.Component{
  render() {
    return <Text> hello this is List </Text>
  }
}

const NavigatorDiv = createStackNavigator({
  Home: {
    screen: Home
  },
  MusicListView: {
    screen: List
  },
}, {
  initialRouteName: 'Home',
});

type Props = {};
export default class App extends React.Component<Props> {
  render() {
    return <NavigatorDiv/>
  }
}

EDIT So it appears that the only way to fix something in react-native is to downgrade it even more, I started with 0.56, maybe by the end of this week I will reach the first alpha, anyways, the error is fixed, the code runs fine with this setup: react-native-cli: 2.0.1 react-native: 0.50.0

what's type Props = {}; that looks suspicious, is that using typescript? - also, since you have import { Component } from 'react' you dont need to do class extends React.Component you can just do class extends Component — Abdul Ahmad
I know React.Component is redundant, but I also know this is not what causing the issue, but thanks for point out anyways, type Props = {}; was there when the project was initialised. Removing it still didn't fix the issue.. — USER745
@DaveNewton yes I referred to errors that come from react-native itself and not from my code, like "cannot set property _currentValue of undefined", and then points to somewhere in node_modules. — USER745

Ahsanwarsi Ahsanwarsi · Accepted Answer · 2019-06-17T13:21:16

In my case; I was using npm primarily in a project & accidentally executed a yarn command. By diving deep, I observed two lock files. Deleting yarn-lock.json did the trick for me.

React-native "Attempted to assign to readonly property"

1 Answers