Attempted import error: 'react-table' does not contain a default export (imported as 'ReactTable')

Question

React Table Import error

Code import style below :

import ReactTable from 'react-table'
import 'react-table/react-table.css'

While its running, its showing error message like this

Attempted import error: 'react-table' does not contain a default export (imported as 'ReactTable').

What to do now?

Answer 1

The new version of react-table supports/uses hooks. to import react-table like import ReactTable from 'react-table' use react-table-6 which is react-table version 6.11.0

Install

# Yarn 
$ yarn add react-table-v6

# NPM 
$ npm install react-table-v6

Import

// ES6
import ReactTable from 'react-table-v6'
// ES5
var ReactTable = require('react-table-v6').default

or use the latest version which is 7.0.0-rc.15

import {
 useTable,
 useGroupBy,
 useFilters,
 useSortBy,
 useExpanded,
 usePagination,

} from 'react-table'

Answer 2

The error talks about there is no named default export like ReactTable. You might need to import objects differently.

Maybe you can try as the following:

import * as ReactTable from 'react-table'

Additionally I checked react-table on the official npmjs page and I see there are examples like the following:

import { useTable, useFilters, useGlobalFilter } from 'react-table';

I guess you might want to use just few specific things from the library thus I suggest to go with importing only the required features like import { } from 'react-table' where between { } you list what you need.