仅导入反应中的特定组件

Question

我正在研究一个带有反应的网络项目 如何从库中仅导入3个组件 我用过：

import Line, Bar, Doughnut from 'react-chartjs-2';

给出错误。

import Line from 'react-chartjs-2';
import Bar from 'react-chartjs-2';
import Doughnut from 'react-chartjs-2';

使所有Line，Bar和Donut元素充当甜甜圈元素。

使用

import {Line, Bar, Doughnut} from 'react-chartjs-2';

加载整个库，这是我不想要的。

注意：我在多个文件中使用该导入。

Answer 1

关于作者如何构建，打包，导出组件/模块/类。

看看react-chartjs-2的gulpfile.js和/lib，您会发现每个课程都没有作为模块导出（CommonJS），所以你只能导入类甜甜圈（或其他类）：

import { Doughnut } from 'react-chartjs-2'

除非您将代码分开并自行重建。

如果您对为什么react-bootstrap可以做到这一点感兴趣，请检查其webpack config，build tools和code structure。我们可以从中得到更多：

• react-chartjs-2 的发布文件结构

  

• react-bootstrap 的发布文件结构