reactjs - npm 反应模块错误
问题描述
我目前正在尝试构建一个反应组件库。
我已经设置了这个项目,但是当我尝试将它包含在演示项目中时,我收到以下错误:
不变违规
元素类型无效:应为字符串(用于内置组件)或类/函数(用于复合组件)但得到:未定义。您可能忘记从定义组件的文件中导出组件,或者您可能混淆了默认导入和命名导入。
检查“App”的渲染方法。
我的 index.js:
import Button from "./components/Button";
export default {
Button
};
我的示例组件
import styled from 'styled-components';
const Button = styled.button`
background: #1FB6FF;
border: none;
border-radius: 2px;
color: #FFFFFF;
cursor: pointer;
display: inline-block;
font-size: 16px;
line-height: 40px;
font-weight: 200;
margin: 8px 0;
outline: none;
padding: 0 12px;
text-transform: uppercase;
transition: all 300ms ease;
&:hover {
background: #009EEB;
}
`;
export default Button;
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
谁能告诉问题出在哪里?
提前致谢!
解决方案
我认为export default { Button }
应该是:export default Button
。
推荐阅读
- python - Trouble getting the position of an element while looping through a list (Python)
- git - Git rejected commit, now I can't find the file
- c# - Unity预制对象位置覆盖编码实例化位置?
- php - 如何使用 Json?
- matlab - 如何确定 k-nn 中的类
- mysql - MySQL 语句复制 - 导致重复行的触发器
- reactjs - 如何使用客户端时区格式化 React SSR 渲染页面中的时间?
- python - Keras - LSTM 最佳批量大小
- flutter - Bottom navigation bar is reloading all the widgets each time I press a navigation item
- python - How to make a class which disallows duplicate instances (returning an existing instance where possible)?