javascript - 在 ES 6 模块中重新导出默认值

Question

在 ES6 中，是否可以缩短以下代码。我有一个App.js文件和一个index.js.

index.js

import App from './App';

export default App;

像这样的东西

index.js

export default App from './App.js'

Answer 1

如果您使用proposal-export-default-fromBabel 插件（它是stage-1preset的一部分），您将能够使用以下代码重新导出默认值：

export default from "./App.js"

有关更多信息，请参阅ECMAScript 提案。

---

另一种方式（没有这个插件）是：

export { default as App } from "./App.js"

---

以上是一种非常常见的做法，当单独的文件（每个文件都有自己的export）具有所有共同点时，例如 ，utils因此，例如，如果想要导入 3 个实用程序函数，而不是编写多个导入：

import util_a from 'utils/util_a' 
import util_b from 'utils/util_b' 
import util_c from 'utils/util_c' 

可以在一行中导入任何实用程序：

import { util_a, util_b , util_c } from 'utils' 

通过在文件夹中创建一个index.js文件/utils并在那里导入所有实用程序的所有默认值并重新导出，因此该index文件将作为与该文件夹相关的所有导入的“网关”。

Answer 2

这与先前的答案有些重复，但要澄清两个选项的区别：

1.默认导出

（这似乎是OP想要的）

export { default } from './App'

// in a different file
import App from './index'

2.命名导出

export { default as App } from './App'

// in another file
import { App } from './index'

这些将与reactvsync 的回答状态一起使用。

Answer 3

import App from './App';

export default App;

⬇</h1>

Babel 7（带有@babel/preset-react）可以转换以下内容：

export { default as App } from './App.js';

---

相关讨论：

• TC39 提案： https ://github.com/tc39/proposal-export-default-from#common-concerns

Answer 4

唯一可行的解​​决方案是：

import App from './App';

export default App;

如果你像这样导出你的模块

export { default as App } from './App.js';

然后它不再是默认导出，如果您尝试将其作为默认导入导入，则会收到错误消息。

Answer 5

import App from './App';
export default (App);

这在默认的“create-react-app”应用程序中对我有用