ตอบสนองไฟล์ JSX ที่ให้ข้อผิดพลาด "ไม่สามารถอ่านคุณสมบัติ '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 import React from 'react'คุณต้องเพิ่มวงเล็บเมื่อสิ่งที่คุณกำลังนำเข้าไม่ใช่การส่งออกเริ่มต้นในโมดูลหรือไฟล์นั้น ในกรณีที่ตอบสนองจะเป็นการส่งออกเริ่มต้น

ซึ่งอาจใช้กับการนำเข้าอื่น ๆ ของคุณขึ้นอยู่กับว่าคุณกำหนดไว้อย่างไร

import React, { Component } from 'react'

สิ่งนี้ได้ผลสำหรับฉัน ฉันไม่แน่ใจว่าเหตุใดจึงแก้ไขปัญหานี้ในเวอร์ชันของฉัน ดังนั้นหากคุณเป็นคนที่ประสบปัญหานี้และคุณใช้ create-react-app เป็นต้นแบบเริ่มต้นวิธีการนำเข้า React นี้จะช่วยแก้เคล็ด (ณ ต.ค. 61 ฮ่า ๆ )

สำหรับผู้ที่ทำงาน ReactJS กับ TypeScript

import * as React from 'react';

ข้อผิดพลาดนี้เกิดขึ้นกับฉันเนื่องจากความประมาท มันเป็นความจริง

import React from 'react';

วงเล็บมีไว้สำหรับการส่งออกที่ระบุชื่อเช่นนี้:

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

เปลี่ยน: นำเข้า {React} จาก 'react' เพื่อ นำเข้า React จาก 'react' เนื่องจาก React เป็นการส่งออกเริ่มต้นและคุณไม่จำเป็นต้องใช้วงเล็บปีกกาสำหรับการส่งออกเริ่มต้นใด ๆ

หากในกรณีที่คุณต้องการนำเข้าหลายคลาสจาก 'react' คุณสามารถมีนามแฝงสำหรับพวกเขายกเว้น React สิ่งที่ต้องการ,

import React, * as react from 'react';

React จะถูกส่งออกโดยค่าเริ่มต้นในโมดูลนั้นไม่จำเป็นต้องมี {}