Javascript 从不同文件导入的最佳方法

我有许多共享的客户端和全局功能。现在我将它们导入到一个文件中并从中导出，这样我就可以像这样在应用程序中导入它们：

一些组件_1.js

import {
  Input,
  useRole,
  PopupContext,
  ProfileContext,
  PriceButton
} from 'shared'
import { regexp, dashUrl } from 'global'

一些组件_100.js

import {
  theme,
  data,
} from 'shared'
import { regexp } from 'global

ReExport shared.js（全局相同，但有其他函数）：

我好奇的是，有没有更好的方法

也许在组件中使用*是最好的方法

import * from 'shared'
import * from 'global'

---

导入是引用，而不是副本，因此，如果您至少使用一次模块，捆绑包大小不会增加（如果您一次或100次导入按钮，则没有区别）。

我尝试遵循的一种模式是，在给定文件夹中有一个管理导出的

索引文件。例如，给定文件夹结构：

src
 |---components
 |  |---InputNumber
 |  |---SearchBox
 |  |---Select
 |---data
 |  |---TestData
 |---utils
    |---MyHelper

我可能在
components
中有一个
index.js
文件，如下所示：

export*from./InputNumber'；
从“./SearchBox”导出*；
导出*自“”/选择“”；

在
src
中，我可能有一个
index.js
文件，如下所示：

export*from./components'；
从“./data”导出*；
从“/utils”导出*；

这就解除了导出到目录/包本身的责任<代码>组件

控制从自身导出的内容，依此类推。

在组件中使用*不是一个好方法。您可以创建递归调用和complexe error进行调试。我个人可能会避免创建这些类型的全局模块，。是的，有了现代的软件包管理器，摇树应该可以优化未使用的导出，但要确保在Web包中没有启用任何副作用。但是像这样做->

从“@mylib/date picker”

导入日期选择器并没有那么糟糕，是吗？。另外，请尝试避免混合大小写的模块名称，

日期选择器

而不是

日期选择器

，它只是避免了跨平台构建时出现的问题和其他奇怪的错误。@Keith如果我有100个组件并且没有共享（使用别名），那么我如何解决导出问题这将使我每次都要导入坚果。

然后我需要一个接一个地导入相对于组件的坚果，

，不确定这意味着什么，。。如果我从中导入{MyMassiveComponent}“@mylib/massive component，我不需要导入它的所有其他小组件，。。我也不必担心相对路径，我尽量避免相对路径，使用

node\u模块

解析逻辑，这很容易做到。不管怎么说，如果你觉得舒服的话，那就标记为主要基于观点，做你所做的是好的。所以这和我的例子一样，只是更多的分离。也许我很懒，但我不想输入5行来导入，而是输入一行来导入100个组件。

src
 |---components
 |  |---InputNumber
 |  |---SearchBox
 |  |---Select
 |---data
 |  |---TestData
 |---utils
    |---MyHelper