CODEWITHSUNDEEP
javascriptreactjsreact-domreact-context
amkhrjee
amkhrjee

Reputation: 956

TypeError: react__WEBPACK_IMPORTED_MODULE_0___default(...) is not a function

I am making a To-do app using the Context API in React. On starting the deveopment server, it throws the error :

TypeError: react__WEBPACK_IMPORTED_MODULE_0___default(...) is not a function enter image description here

I am a beginner in React and cannot find out any possible reason for this problem to occur. Here is my App.js : 

import React, {useReducer} from 'react';
import Container from "reactstrap/lib/Container";
import "bootstrap/dist/css/bootstrap.min.css";
import './App.css';

import {TodoContext} from './Context/TodoContext';
import todoReducer from "./Context/reducer";

const App = () => {
  const [todo, dispatch] = useReducer(todoReducer, [])
  return(
    <TodoContext.Provider value={{todo, dispatch}}>
      <Container fluid>
        <h1>
          Todo App with Context API
        </h1>
      </Container>
    </TodoContext.Provider>
  )
}

export default App;

I am using ^16.3.1 for both react and react-dom

Upvotes: 17

Views: 101089

Answers (3)

Văn Minh Nguyễn
Văn Minh Nguyễn

Reputation: 1

export {default} from './InsuranceCreate'; the correct answer

the one that causes bugs import InsuranceCreat from './InsuranceCreate'; export default InsuranceCreate;

Upvotes: 0

new Q Open Wid
new Q Open Wid

Reputation: 2313

Import createContext with brackets so React knows you're taking the function instead of the whole thing. That way you can actually export the function out. This is where the error in your code popped up. If you didn't, then React would not think that createContext was a function.

Upvotes: 6

Adam Jeliński
Adam Jeliński

Reputation: 1788

In your TodoContext.js you incorrectly imported createContext. Instead of

import createContext from 'react';

you should use

import { createContext } from 'react';

Upvotes: 38

Related Questions