ES6，如何在一行中导出导入的模块？

Posted 2023-02-22

【中文标题】ES6，如何在一行中导出导入的模块？

【英文标题】：ES6, how can you export an imported module in a single line?

【发布时间】：2016-06-10 11:56:19

【问题描述】：

如果可能的话，我想要以下内容，但使用一行：

import Module from './Module/Module;' export Module;

我尝试了以下方法，但似乎不起作用：

export Module from './Module/Module;

【问题讨论】：

另见Is there any one-line analog in ES6 for ES5 module.exports = require('./inner.js')?和Is export foo as default valid ES6?

【参考方案1】：

export default as Module from './Module/Module';

是标准的 ES6 方式，只要您不需要 Module 也可以在执行导出的模块内使用。

export Module from './Module/Module';

是一种提议的 ESnext 方法，但仅当您现在在 Babel 中启用它时才有效。

【讨论】：

它工作得很好，但是，Webpack 似乎不喜欢这样，通知component 现在是只读的，无法热重新加载。很奇怪！

完美，这应该是公认的答案。 （如果 webpack 热重载不喜欢那是那个工具或者它的 HMR 插件的问题。）

如果有人想知道它是哪个 babel 插件，这里是 export-extensions - babeljs.io/docs/plugins/transform-export-extensions

@loganfsmyth 有没有办法将上述内容导出为默认值？

@abhishek-kdm export default as default from 或 export default from

【参考方案2】：

我不知道为什么，但这对我有用：

组件/index.js：

import Component from './Component';
import Component2 from './Component2';
import Component3 from './Component3';
import Component4 from './Component4';

export Component, Component2, Component3, Component4;

我这样导入导出：

import Component, Component2, Component3, Component4 from '../components';

【讨论】：

⚠这个方法秒杀三抖

如何调整以不杀死摇晃树？

【参考方案3】：

请注意，您还可以重新导出模块中的所有内容：

export * from './Module/Module';

【讨论】：

此通配符语法仅适用于具有命名导出的文件。如果文件只有一个默认导出，您将收到错误“模块中未找到命名导出”。

【参考方案4】：

对于 React Native 组件，此语法适用于我：

export default from 'react-native-swiper';

【讨论】：

当我希望重新导出导入的默认值时，这适用于 React（不是 Native）。我在 index.js 文件中使用它，这些文件不会将任何 HOC 应用于我的“纯”组件

【参考方案5】：

// Service
// ...
export const paymentService = new PaymentService()

// Entry services/index.js file
export * from './paymentService'

// use it like
import  paymentService  from './services/'

【参考方案6】：

所以，我发现这对于在 components 目录的根目录下有一个 index.js 以便于引用的即时导出功能非常有效：

import Component from './Component/Component'
import ComponentTwo from './ComponentTwo/ComponentTwo'

module.exports = 
  Component,
  ComponentTwo
;

您需要使用module.exports。

【讨论】：

请记住，由于这部分是 CommonJS 模块，因此它只能在 Babel 中专门工作，如果您尝试在真正的 ES6 模块中使用它，一旦对它们的支持进入更多环境，就会失败，并且可能会在未来版本的 Babel 中停止工作。

正确。在 Babel 6 中混合 commonJS 和 es6 导入/导出中断。 Babel5 允许/加强了这种不正确的行为。在您的示例中，Component 将不再是对导出组件的引用，而是一个对象，您的实例引用位于 Component.default

有人知道如何在不使用 module.exports 的情况下执行此操作吗？我喜欢这种将一堆组件打包成index.js 的方法，但无法弄清楚语法。 import x from 'x'; import y from 'y'; export default x, y; 然后 import x from xy; 不起作用（我不知道为什么不）

Alex，你试过export x, y吗？

这个答案不是 es6。它是一个非 EcamScript 平台。 -1