reactjs - 仅导入反应中的特定组件

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 元素充当 Donut 元素。

使用

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

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

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

score 2 · Accepted Answer

它是关于作者如何构建、打包、导出组件/模块/类的。

看一下 react-chartjs-2 的gulpfile.js和/lib，你会看到每个类都没有导出为模块（CommonJS），所以你只能像这样导入类Donut（或其他类）：

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

除非您将代码分开并自己重建它们。

如果您对 react-bootstrap 为何能做到这一点感兴趣，请查看它的webpack 配置、构建工具和代码结构。我们可以从以下方面获得更多信息：

1 回答 1