ES6+ 导出默认导出中的导入答案

【问题标题】：ES6+ export of an import within export defaultES6+ 导出默认导出中的导入
【发布时间】：2019-05-04 12:57:06
【问题描述】：

我正在尝试这样做

state.js

export default {
  someValue: 'fooBar'
}

index.js

export default {
  export {default as state} from './state',
  export {default as actions} from './actions'
}

但我不允许，Unexpected keyword 'export' (2:2)。有什么方法可以实现吗？

【问题讨论】：

您到底想达到什么目的？嵌套的export 没有任何意义，因为export 不是表达式。
我只是想消除一个导入行 import state from './state' 然后我 export default { state } 它
我想您可能正在寻找dynamic imports，但目前浏览器支持仅限于浏览器的预发布版本。即使有了这些，你仍然没有得到导出的值，而是一个持有它们的 Promise。

标签： ecmascript-6 import export

【解决方案1】：

您只能在模块的顶层使用import 和export。（您可以在别处使用动态import()，但不能使用静态版本。）

因此，要进行导出，您必须按照您所说的在 cmets 中尽量避免的操作：

import {default as state} from './state';
import {default as actions} from './actions';
export default {
  state, actions
};

但是，请注意您在那里导出的内容：具有state 和actions 属性的对象，其初始值来自导入的state 和@ 987654328@，但与它们未连接。导入该对象的代码可以更改这些属性。您可以维护实时绑定：

import {default as state} from './state';
import {default as actions} from './actions';
export default {
  get state() {
    return state;
  },
  get actions() {
    return actions;
  }
};

但此时您正在重新发明模块命名空间对象。您可能更喜欢简单地：

export {default as state} from './state.js';
export {default as actions} from './actions.js';

然后使用那些命名的导出：

import {state, actions} from "./index";

或者使用模块命名空间对象

import * as index from "./index";
// Use `index.state` and `index.actions`

【讨论】：