React JSX 파일에서“Undefined의 'createElement'속성을 읽을 수 없습니다.

실행중인 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'오는 것이 해당 모듈이나 파일의 기본 내보내기가 아닌 경우 대괄호를 추가합니다. 반응의 경우 기본 내보내기입니다.

정의한 방법에 따라 다른 가져 오기에 적용될 수 있습니다.

import React, { Component } from 'react'

이것은 나를 위해 일했습니다. 그래도이 문제의 내 버전이 왜 수정되었는지 모르겠습니다. 따라서이 문제를 우연히 발견하고 create-react-app을 시작 상용구로 사용하는 경우 React를 가져 오는이 방법이 트릭을 수행합니다. ('18 년 10 월 현재 웃음)

TypeScript로 ReactJS를 사용하는 사람들을 위해.

import * as React from 'react';

이 오류는 부주의로 인해 발생했습니다. 실제로

import React from 'react';

대괄호는 다음과 같이 명명 된 내보내기를위한 것입니다.

import React, { useState, useEffect } from 'react';

변경 : '반응'에서 가져 오기 {반작용} 에 수입 '반응'에서 반작용 기본 수출이다 반작용 때문에 당신이 어떤 기본 수출 중괄호가 필요하지 않습니다.

'react'에서 여러 클래스를 가져와야하는 경우 React를 제외하고 별칭을 가질 수 있습니다. 같은 것,

import React, * as react from 'react';

React 기본적으로 해당 모듈에서 내보내지며 {}이 필요하지 않습니다.