Uncaught (в обещании) TypeError: Не удается прочитать свойство «createElement» неопределенного (...)

Question

Мне нужно было реорганизовать мой функциональный компонент без состояния в класс. Однако, когда я это сделал, я все равно получаю сообщение об ошибке, когда он выглядит так, как будто сам React не определен.

import React from 'react'; 
import { Cell } from 'fixed-data-table'; 

const DataCell = ({rowIndex, columnKey, data, onMessageClicked, ...props}) => { 
    return (
    <Cell {...props} onClick={onMessageClicked(data[rowIndex].Id)}> 
     {data[rowIndex][columnKey]} 
    </Cell> 
); 
}; 

export default DataCell; 

в

import { React, Component } from 'react'; 
import { Cell } from 'fixed-data-table'; 

class DataCell extends Component { 

    onCellClicked() { 
    this.props.onMessageClicked(this.props.data[this.props.rowIndex].Id); 
    } 

    render() { 
    const {rowIndex, columnKey, data, ...props} = this.props; 
    return (
     <Cell {...props} onClick={onCellClicked}> 
     {data[rowIndex][columnKey]} 
     </Cell> 
    ); 
    } 
} 

export default DataCell; 

bundle.js:43248 Uncaught (in promise) TypeError: Cannot read property 'createElement' of undefined(…)

и когда я иду к этой линии я вижу

return _react.React.createElement(

Я не понимаю. Как мне отладить/исправить это?

Мой полный код для этого приложения: here в случае, если код, который я размещаю, не имеет никакого отношения.

Спасибо!

Answer 1

О ...

import { React, Component } from 'react';

должен быть

import React, { Component } from 'react';

:)

Answer 2

ОП ответил на вопрос, это сам, но без причины так вот причина! {Непосредственно цитируя https://github.com/facebook/react/issues/2607#issuecomment-225911048 "}

import { React, Component } from 'react'; 

неверны, должны быть

import React, { Component } from 'react'; 

Там нет имени экспорта по имени React. Это сбивает с толку, потому что React представляет собой модуль CommonJS, и так как вы ., используя импорт ES6, Бабель пытается отобразить семантику, но они не совпадают в точности {компонент} на самом деле захватывает компонент из React себя, так что вы могли бы просто:

import React from 'react' 

и используйте вместо этого React.Component, если он менее запутан.

Answer 3

Для меня в машинописном решение было:

import * as React from 'react';