[解決済み] React JSX ファイルでエラー "Cannot read property 'createElement' of 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'から正常にインポートしているのに、なぜReactが未定義になるのでしょうか？_react.Reactなんだから、どうしたって...。

どうすればいいですか？

Reactをインポートするには、次のようにします。 import React from 'react' インポートするものが、そのモジュールやファイルのデフォルトのエクスポートでない場合は、括弧を追加します。reactの場合は、デフォルトのエクスポートです。

これは、あなたが定義した方法によっては、他のインポートにも適用されるかもしれません。