我在某处读到，导入模块与花括号周围的大括号反应，而是导入整个库，并有效地增加了包的大小。我正在使用这个概念，并且成功地导入了没有花括号的模块，如下所示：
import Jumbotron from 'reactstrap';
它工作正常。我不知道为什么下次构建代码时，它开始向我显示此警告：
WARNING in ./React Coursera/Header.js 5:71-77
export default (imported as Jumbotron) was not found in reactstrap。
该应用也没有在浏览器中运行。
然后我去node_modules检查jumbotron中是否存在export default，我发现了这个语句：
export default Jumbotron;
这意味着它确实将 Jumbotron 导出为默认值，那么为什么它向我显示此警告。
你们能帮我解决这个问题吗？
提前致谢！
【问题讨论】：
标签： javascript reactjs import
你在哪里读到使用 curly 导入会增加包大小，它是相反的，
// below line will import everything
import * as reactstrap from 'reactstrap'
但是
// this will import only specific module
import { Jumbotron } from 'reactstrap'
通过这一行：
// will import from /reactstrap/index.js
import Jumbotron from 'reactstrap';
你没有导入任何东西 https://github.com/reactstrap/reactstrap/blob/master/src/index.js ，因为有导出默认值
所以我不知道以前在你的情况下它是如何工作的
下一行：
// and this line is not inside the /reactstrap/index.js but /reactstrap/Jumbotron.js
export default Jumbotron;
在这里：https://github.com/reactstrap/reactstrap/blob/master/src/Jumbotron.js
所以你可以这样做：
import { Jumbotron } from 'reactstrap'
【讨论】：
export default Jumbotron，那么你可以放心地写import Jumbotron from 'reactstrap';。那只会导入 Jumbotron。当我使用花括号时，我注意到在构建输出中，reactstrap 的所有组件都被导入了，还有那些我根本不需要的组件。
from 'reactstrap'; 这将指向index.js，如果您检查index.js，您将找不到export default Jumbotron
这取决于您的构建设置和/或库代码的设置方式。某些库的构建方式在您使用花括号时不会导入整个库。您还可以在您的构建工具中启用名为“摇树”的功能，这将删除所有未使用的代码。
我猜您尝试做的是单独导入 Jumbotron，当您不确定是否会导入整个库时，这是一个安全的选择。同样，它取决于库的文件结构，但您可能缺少导入中的子目录。每个组件的 node_module 文件夹内都应该有目录。可能类似于node_modules/reactstrap/Jumbotron。您看到的默认导出可能在 Jumbotron 文件中。当您使用import Jumbotron from 'reactstrap' 时，您要求它为库的“主”文件找到默认导出。这将在库的package.json 文件中定义。
您需要做的是像这样（只是在这里猜测）import Jumbotron from 'reactstrap/Jumbotron' 将子目录添加到您的导入中。想想reactstrap/ 是库的根目录，你可以像往常一样选择任何文件。
如果您使用的是 webpack，有一个很棒的插件，您可以在其中检查包中包含的内容，以确保您确实只导入了您需要的代码https://github.com/webpack-contrib/webpack-bundle-analyzer
【讨论】：