ES6 默认和命名导出

Question

我正在尝试了解命名导出和默认导出。我有一个看似基本的要求，但我不知道如何设置。

我希望能够同时导入：

//app.js
import Mod from './my-module'
import { funcA, funcB } from './my-module'

console.log('A', Mod.funcA(), funcA()); // A a a
console.log('B', Mod.funcB(), funcB()); // A a a

当我尝试时，最接近的方法如下：

//my-module.js
export function funcA() { return 'a'; };
export function funcB() { return 'b'; };

export default {funcA, funcB}

我的麻烦是我不想在默认导出中重新索引每个函数。我只想定义我的函数，然后确保它们被导出，这样我就可以使用它们了。

建议？或者我必须使用 import * as Mod from './my-module';?

Answer 1

使用 * as name:

一次导入整个模块的内容

import * as Mod from './my-module';

然后使用解构将它们分配给单独的常量：

const { funcA, funcB } = Mod;

对于导出，只需使用命名导出：

export function funcA() { return 'a'; };
export function funcB() { return 'b'; };

Answer 2

您可以省略默认导出并使用导入作为语法：

//app.js
import * as Mod from './my-module'
import { funcA, funcB } from './my-module'

console.log('A', Mod.funcA(), funcA()); // A a a
console.log('B', Mod.funcB(), funcB()); // B b b

//my-module.js
export function funcA() { return 'a'; };
export function funcB() { return 'b'; };

ES6 默认和命名导出

ES6 default and named exports

javascript

export

ecmascript-6

es6-module-loader