ReactJS 无法导入组件答案

【问题标题】：ReactJS failing to import componentsReactJS 无法导入组件
【发布时间】：2017-09-21 22:17:50
【问题描述】：

我对 ReactJS 很陌生，但从我收集到的以下代码应该可以工作，但它没有。

我使用 npm 命令create-react-app 创建了一个新的 ReactJS 项目。在我的项目文件夹中，我使用npm install --save material-ui@next 安装了 Google 的材料 ui。

根据我尝试从“material-ui”导入的内容，我遇到了各种错误。

import Card from 'material-ui/Card'

我使用 VS Code 作为我的编辑器，如果我在“material-ui/Card”上按 F12，它会显示 Card 是默认导出，并且上面的导入有效。

import {Card} from 'material-ui'

如果我在“material-ui”上按 F12，它会显示 Card 是一个命名导出，并且上面的导入有效。

当我尝试导入其他东西时，我遇到了麻烦。例如：

import {Card, CardText} from 'material-ui'

卡片导入正常，但是当我尝试使用时出现以下错误：

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.

但是，据我所知，它们都以完全相同的方式导出。

declare module "material-ui" {
    export import Card = __MaterialUI.Card.Card;
    export import CardText = __MaterialUI.Card.CardText;
}

并进一步挖掘：

export interface CardTextProps {
    actAsExpander?: boolean;
    color?: string;
    expandable?: boolean;
    style?: React.CSSProperties;
    className?: string;
}
export class CardText extends React.Component<CardTextProps> {
}

当其他导入看起来应该可以工作时，我也会失败：

import getMuiTheme from 'material-ui/styles/getMuiTheme'

Module not found: Can't resolve 'material-ui/styles/getMuiTheme'

但据我所知，它就在那里......

【问题讨论】：

标签： reactjs typescript material-ui

【解决方案1】：

我认为您使用的是版本 0.19.2 的打字稿定义，而不是 material-ui@next 所指的新版本 1.0.0beta。

V1 源甚至没有 CardText：https://github.com/callemall/material-ui/tree/v1-beta/src/Card。导入是这样的：

import Card, { CardHeader, CardMedia, CardContent, CardActions } from 'material-ui/Card';

【讨论】：