Question

我有一个分为“模块”的项目。

每个模块都有一个 导出文件 ，可以从模块中导出多个文件。

按照惯例，我们只需要在模块中公开的内容。

例如，如果我有“顶栏”和“工作区”模块并且需要进行通信，“顶栏”会暴露仅 index.js和“工作区”需要所需的部分它的“顶级酒吧”：

顶栏/ index.js：

export TopBarComponent from './components/TopBarComponent'

export SomethingElse from './service/SomethingElse'

工作区/部件/ Workspace.js：

import {TopBarComponent} from 'TopBarComponent'
....

虽然这种方式非常模块化，但我的问题是，当“Workspace”需要“TopBarComponent”时，“SomethingElse”会在此过程中被导入。

关于如何使用每个模块的假设index.js来预防它的任何想法都是导出文件，只有导出行？

Answer 1

让我说清楚。


ES6导入/导出应该伴随babel loader，因为它不支持浏览器。

默认导出应在不使用{}的情况下导入，而其他导出则使用{}
导入
我已经提供了一个基本示例，其中Main.js使用TopBarComponent   导出值和TopBarComponent使用index.js导出值。如果您按照基本步骤进行操作，则应该没有任何问题。

EG。如果你有

请参阅以下代码

index.js

var something;
 var data = "index Data 1"
 export data
 export default "index Data 2"

TopBarComponent.js

import defaultData , {data} from 'index'
...
..
var topbardata = "something"
export default {key : []};
export topbardata ;

Main.js

import defaultData , {topbardata} from 'TopBarComponent'

您只是导出您想要的内容。其余代码不包括在内导出永远不会导入

在Webpack中，导出文件如何不导入它导出的所有内容？

1 个答案: