React JSX file, дающий ошибку "Невозможно прочитать свойство" createElement "из undefined"

У меня есть файл test_stuff.js, который я запускаю с npm test

Это выглядит примерно так:

import { assert } from 'assert';
import { MyProvider } from '../src/index';
import { React } from 'react';

const myProvider = (
  <MyProvider>
  </MyProvider>
);

describe('Array', function() {
  describe('#indexOf()', function() {
    it('should return -1 when the value is not present', function() {
      assert.equal(-1, [1,2,3].indexOf(4));
    });
  });
});

К сожалению, я получаю сообщение об ошибке

/Users/me/projects/myproj/test/test_stuff.js:11
var myProvider = _react.React.createElement(_index.MyProvider, null);
                             ^

TypeError: Cannot read property 'createElement' of undefined
    at Object.<anonymous> (/Users/me/projects/myproj/test/test_stuff.js:7:7)

Что это значит? Я импортирую React из "реагировать" успешно, так почему React будет undefined? Это _react.React, что бы это ни значило...

Ответ 1

Чтобы импортировать React do import React from 'react' Вы добавляете скобки, когда вещь, которую вы импортируете, не является экспортом по умолчанию в этом модуле или файле. В случае реакции, это экспорт по умолчанию.

Это может относиться к вашему другому импорту в зависимости от того, как вы их определили.

Ответ 2

import React, { Component } from 'react'

Это сработало для меня. Я не уверен, почему это исправило мою версию этой проблемы, все же. Так что, если вы столкнулись с этой проблемой и используете в качестве стартового шаблона create-Reaction-app, этот способ импорта React поможет. (по состоянию на октябрь 18 года, смеется)

Ответ 3

Для тех, кто работает ReactJS с TypeScript.

import * as React from 'react';