React JSX文件给出错误“;无法读取属性'createElement'“未定义”;

React JSX file giving error "Cannot read property 'createElement' of undefined"

本文关键字：未定义 属性 读取 createElement 文件 JSX 出错 React 错误      更新时间：2023-09-26

我有一个使用npm test 运行的文件testrongtuff.js

它看起来像这样：

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 do import React from 'react'，当您正在导入的东西不是该模块或文件中的默认导出时，您会添加方括号。在react的情况下，它是默认导出。

这可能适用于您的其他导入，具体取决于您如何定义它们。

import React, { Component } from 'react'

这对我很有效。但我不知道为什么它修复了我对这个问题的看法。因此，如果你是一个偶然发现这个问题的人，并且你使用create-rect应用程序作为你的启动样板，这种导入react的方式就可以了。(截至2018年10月，lol(

适用于使用TypeScript处理ReactJS的用户。

import * as React from 'react';

由于疏忽，我出现了这个错误。实际上是

import React from 'react';

括号用于命名导出，例如：

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

从React导入React时出现此问题，我将其放在花括号内。

请这样做：

import React, {useState} from "react";

代替：

import {React, useState} from "react";

我在单元测试时尝试模拟组件时遇到了这个问题，但没有正确设置

我所做的导致错误的事情：

jest.mock("./SomeComponent", () => {
    return <div>MockSomeComponent</div>
});

我需要做的：

jest.mock("./SomeComponent", () => {
    return () => <div>MockSomeComponent</div>
});

尝试使用析构函数导入React对象可能会导致类似以下import {React} from 'react';的问题。这可能是90%运行上述代码时出现错误的原因。

而是使用：import React from 'react';

然后，您可以通过以下方式访问React类的任何成员：反应

更改：从"React"导入｛React｝到导入React因为React是一个默认导出，任何默认导出都不需要大括号。

如果您需要从"react"导入多个类，则可以为它们设置除react之外的别名。类似

import React, * as react from 'react';

React在该模块中默认导出，无需{}。

此错误可能是由于疏忽造成的。请添加

import React from 'react'

之后它将被解决
相关文章：