Home > Software engineering >  "React is not defined"
"React is not defined"

Time:09-21

I'm very new to react-native & Viro-react platforms. Currently, I'm working on an AR/VR app for my final year project. In that project, I need to apply redux functionality and implement a common store for my entire application. I've created store/index.js (store), store/reducer/index.js (root reducer) & store/reducer/initial_Reducer.js, store/actions/initial_Action.js correctly. following are them.

store/index.js (store)

import rootReducer from './reducers';
import {createStore} from 'redux';

const store = createStore(rootReducer);

export default store;

store/reducer/index.js (root reducer)

import initial_Reducer from './initial_Reducer';
import { combineReducers } from 'redux';

const rootReducer = combineReducers({
    initial_Reducer: initial_Reducer,
});

export default rootReducer;

store/reducer/initial_Reducer.js

const initial_Reducer = (state = {store:true}, action) => {
    console.log("Initial Reducer..");
    switch (action.type) {
        case 'initialize': {
            return state;
        }
        default:
            return state;
    }
}

export default initial_Reducer;

store/actions/initial_Action.js

export const initializeStore = () => {
    console.log("Initial Action..");
    return {
        type: 'initialize'
    }
}

When I try to apply the store to with tag, it gives me the following error.

React is not defined

Please check this screenshot

My index.js & index.android.js are as follows.

index.js

import { AppRegistry } from 'react-native';
import App from './App.js';

import store from './store/index'; //importing redux store config from store/index.js
import { Provider } from 'react-redux/src'; //importing binding layer from reac-redux

// The below line is necessary for use with the TestBed App
AppRegistry.registerComponent('ViroSample', () =>
    <Provider store={store} >
        <App />
    </Provider>
);

index.android.js

import { AppRegistry } from 'react-native';
import App from './App.js';

import store from './store/index'; //importing redux store config from store/index.js
import { Provider } from 'react-redux/src' //importing binding layer from reac-redux

// The below line is necessary for use with the TestBed App
AppRegistry.registerComponent('ViroSample', () =>
    <Provider store={store} >
        <App />
    </Provider>
);

CodePudding user response:

You should import React in both files index.android.js and index.js

import React from "react";

CodePudding user response:

Add import 'react'; in all files containing JSX and don’t utilize React explicit.

In your case this are index.android.js and index.js and rename these files form *.js to *.jsx.

  • Related