代码之家 › 专栏 › 技术社区 › Anh Pham

模块生成失败:重复声明

antd reactjs javascript

Anh Pham · 技术社区 · 8 年前

我正在我的React项目中使用Ant设计框架。但在导入组件时,它会发出一个错误,即使我以前没有声明这些组件。

错误:

Module build failed: Duplicate declaration "Icon"

代码如下:

// App.js

import React from 'react';
import ReactDOM from 'react-dom';
import { FullSpinner } from "./Spinner"

class App extends React.Component {
  render() {
    return (<div>sdkfjsdf</div>)
  }
}

export default App

// Spinner.js

import { Spin, Icon } from 'antd';

import React from 'react'
import {Icon, Spin} from 'antd';

const antIcon = () => <Icon type="loading" style={{ fontSize: 24 }} spin />;


export const FullSpinner = () => <Spin indicator={antIcon} />

2 回复 | 直到 8 年前

Gopal Joshi 8 年前

您已导入 Icon 组件多次。

// Spinner.js

import { Spin, Icon } from 'antd';
import React from 'react'
import {Icon, Spin} from 'antd';  <- Duplicate

const antIcon = () => <Icon type="loading" style={{ fontSize: 24 }} spin />;
export const FullSpinner = () => <Spin indicator={antIcon} />

删除后重试 import { Spin, Icon } from 'antd'; 从…起 Spinner.js

thgaskell 8 年前

你的 Spinner.js 文件正在导入 Spin 和 Icon 两次从 antd 单元您可以安全地删除其中一条线。

// Spinner.js

import React from 'react'
import {Icon, Spin} from 'antd';

const antIcon = () => <Icon type="loading" style={{ fontSize: 24 }} spin />;


export const FullSpinner = () => <Spin indicator={antIcon} />

推荐文章

Franva · 如何使用Webpack 3配置Ant设计

8 年前

enzeberg · 在Ant Design中,如何将图标垂直居中?

8 年前

Emo · 导入Ant设计组件无效

8 年前

ThePainnn · 由第三方(antd)样式覆盖的样式化组件

8 年前

Michael Fernandes · 垂直菜单蚂蚁设计高度100%

8 年前

Thijs Koerselman · 如何包装组件并继承其props接口

8 年前

willywonka15 · 如何禁用react中的子菜单项?

8 年前

Thijs Koerselman · Ant Design antd与antd mobile用于非本地移动web开发

8 年前

Yichz · 包装Antd组件

9 年前

Avery235 · rc时间选择器在移动设备上未正确显示

9 年前