当前位置: 博客 /  ReactJs  / 运行React项目出错:Element Type Is Invalid: Expected a string...

运行React项目出错:Element Type Is Invalid: Expected a string...

在运行一个React的项目时,发生了这个错误:

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it’s defined in, or you might have mixed up default and named imports.

截图

Element type is invalid

解决方法

1.定位到问题

要先定位到大概出错了的地方,从控制台定位可能出问题的地方,尽可能找到提示Check your code at xxx某一行的信息;

2.检查import引用的大括号{}问题

import的内容,是否要加大括号{},取决于export的方式,比如import {Provider} from 'react-redux';,如果去掉{}变成import Provider from 'react-redux';,就会出错了。

大括号{}错误的使用是出这种错误比较多的情况。

  1. 如果是npm官方包,直接去npm或GitHub查看官方示例

  2. 如果是自己定义的组件,组件使用export default XXX的,在别的地方import时不要加大括号{}

3.检查import的npm包的版本

如果大括号{}的引入都正确,还有可能是安装的package的版本有问题,比如版本有更新导致语法不兼容。

  1. 基于你知道正确版本的情况,可以回退版本或更新版本,在package.json中修改版本号后,重新npm install来安装即可。

  2. 去npm官网或GitHub查看文档,查找你当前安装的版本对应的使用文档,然后更新项目中使用的语句。

- END -