【React】报错:React.createElement: type is invalid -- expected a string (for built-in components) or a c

技术栈

React / Ant Design Pro

背景

第一次使用antd pro 开发, 需要自定义一个全局业务组件,

问题

照着原项目在src/components 下创建个组件 , export default ComponentName , 然后再pages里引入 import { ComponentName } from ‘components’ , 于是报错 Warning: React.createElement: 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.

查了一下这是ES6 模块导出及引入的问题 , 仔细检查对比了其他业务组件的导出和引入, 都是这样做的, 实在想不通~

看到这个帖子 : https://www.cnblogs.com/wind-wang/p/9453167.html
终于解决了!!! 感谢原博!!

解决办法

组件 :

import React from 'react'

const TextEditor = ({ data }) => {
  return (
    <div>
    	我是个组件~
    </div>
  )
}

export default TextEditor

页面引入组件 :

import ComponentName from  'components/TextEditor';

说在最后
至今没想通为什么按照原项目的方式导出引入报错 (枯了…)

因为我在pages components 下同样方式也没问题呀~~~~~~~~

哎, 要好好补习ES6了 (哭哭哭~~~~)