javascript 不包含名为的导出
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/49744226/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
does not contain an export named
提问by Rafael Augusto
I'm trying to import a simple component into my React. I'm having trouble locating this component.
我正在尝试将一个简单的组件导入到我的 React 中。我无法找到此组件。
I'm getting the following error while importing component
导入组件时出现以下错误
./src/App.js 61:28-32 './componentes/Menu' does not contain an export named 'Menu'.
./src/App.js 61:28-32 './componentes/Menu' 不包含名为 'Menu' 的导出。
This is my simple component:
这是我的简单组件：
import React, { Component } from 'react';
import { Button } from 'react-bootstrap';
export default class Menu extends Component {
render() {
return (
<div>
<Button bsStyle="danger">Hello World Dangerhahahah</Button>
</div>
);
}
}
I'm calling it as follows in my App.
我在我的应用程序中按如下方式调用它。
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import { Menu } from './componentes/Menu';
import { Button } from 'react-bootstrap';
class App extends Component {
constructor(props) {
super(props)
}
render() {
return (
<div>
<Menu />
<Button bsStyle="danger">Take this action</Button>
<div className="App">
<div className="bs-header" id="content">
<div className="container">
<h1>Template Changelog</h1>
<p>Lists all changes to the HTML template files</p>
</div>
</div>
</div>
);
}
}
export default App;
采纳答案by otakustay
In your Menu.jsyou are using export defaultwhich creates a export entry named defaultregardless what is the name of class
在您Menu.js正在使用export default它创建一个导出条目，default无论类的名称是什么
You should either:
你应该：
- Use
import Menu from './components/Menu';inApp.js - Use
export class Menu extends ComponentinMenu.js
- 使用
import Menu from './components/Menu';中App.js - 使用
export class Menu extends Component中Menu.js
回答by Michael Elliott
It's because you're trying to destructure the exported default component from the file.
这是因为您试图从文件中解构导出的默认组件。
Just remove the brackets around the Menufrom the import statement in the App component so import { Menu } from './componentes/Menu';becomes import Menu from './componentes/Menu';
只是删除周围的括号Menu从import语句在App组件，以便import { Menu } from './componentes/Menu';成为import Menu from './componentes/Menu';
回答by CraZyDroiD
try changing import { Menu } from './componentes/Menu';to import Menu from './componentes/Menu';
尝试更改import { Menu } from './componentes/Menu';为import Menu from './componentes/Menu';
