Uncaught ReferenceError: Cannot access 'CONFIG' before initialization

Question

The project created by CRA.

utils/config.js

   CONFIG={
    test:'test
   }

Then I imported at my src/index.js(which is root of project)

    <Provider store={store}>
            <Router>
                <Switch>
                    <Route path='/' exact>
                        <MainContainer title={'Welcome to something'} />
                    </Route>
                    <Route path='/dummy' exact>
                        <DummyContainer />
                    </Route>
                    <Route path='/pop/:topicId' exact>
                        <Popup />
                    </Route>
                    <Route path='/app' exact>
                        <App />
                    </Route>
                </Switch>
            </Router>
        </Provider>,

import 'utils/config';

I can access CONFIG from my component which is called from src/index.js

but error occurred that cannot access to CONFIG.

Is there anyway to put CONFIG in very first state?

THANK you.

Answer 1

make sure you exported it correctly. It should be either default or named export. try changes below

utils/config.js

export default {
  test:'test'
}

src/index.js(which is the root of the project)

import config from 'utils/config'

now you can use your config object as you want