Question

我正在使用货币转换器应用程序，我从密码笔（https://codepen.io/jmean/pen/Oxmgxp）中获取了密码。我正在尝试运行此代码，但出现此错误：./src/index.js 尝试导入错误：未从“ ./App”导出“ App”。

我尝试添加导出默认App（）；在index.js以及App.js文件上，但无法正常工作。

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import {App} from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App />, document.getElementById('root'));

我希望代码能够像在代码笔上一样编译并显示在浏览器中。

Answer 1

如果是默认导出，则无需将导入放在大括号中。

import App from './App';

是你应该写的。

Answer 2

有两种构造导入/导出对的方法。

默认值：

App.js

export default class App { ... }

index.js

import App from './App';

非默认值：

App.js

export class App { ... }

index.js

import { App } from './App';

Answer 3

导入对App组件的反应时出错，这是一个愚蠢的问题，我以不良的方式导入了react核心。

此已编译但存在该错误

import {ComponentName} from "./ComponentName"

这有效：

import ComponentName from './ComponentName'

这很奇怪，但是希望会有所帮助！

Answer 4

有两种导出方式，

命名导出

使用命名导出，每个文件可以有多个命名导出。然后导入他们想要用括号括起来的特定出口。导入模块的名称必须与导出模块的名称相同。

// imports
import { MyComponent } from "./MyComponent";

// exports from ./MyComponent.js file
export const MyComponent = () => {}

默认导出

每个文件只能有一个默认导出。导入时，我们必须指定一个名称并导入，例如：

// import
import MyDefaultComponent from "./MyDefaultExport";

// export
const MyComponent = () => {}
export default MyComponent;

注意：导入的命名在默认导出中是完全独立的，我们可以使用任何喜欢的名称。

尝试导入错误：未从“ ./App”导出“ App”

4 个答案:

默认值：

非默认值：