Javascript 如何使用SystemJS加载命名导出

如果我有一个lib，比如说

utils.js

，看起来像这样

exports.foo = function () {
    return 'foo';
};

exports.bar = function () {
    return 'bar';
};

可按如下方式使用

import {foo} from './libs/utils';

console.log(foo());

不是很壮观，但我觉得这个问题是文章中描述的问题的根源。无论如何，我不能让这个工作结合起来。我必须更改代码来修复它

import utils from './libs/utils';

console.log(utils.foo());

这是我的systemjs配置文件：

SystemJS.config({
    map: {
        'plugin-babel': 'node_modules/systemjs-plugin-babel/plugin-babel.js',
        'systemjs-babel-build': 'node_modules/systemjs-plugin-babel/systemjs-babel-browser.js',
    },
    packages: {
        '.': {
            defaultJSExtensions: 'js'
        }
    },
    transpiler: 'plugin-babel'
});

因此，似乎只能加载

导出

对象，而不能加载命名导出。这个问题能解决吗

更新我觉得它可以修复

---

但到目前为止，它给出了相同的问题

这种行为不是特定于SystemJS的。自版本0.20以来，SystemJS的行为就是这样的，因为这是ES6模块互操作性的标准化

当您使用ES6

import

导入CommonJS模块（通过

module.exports

导出）时，您将只获得整个导出，并且无法立即对导出的名称进行结构化

但是，当您导入通过ES6导出的模块时，您将能够解构导出的名称

所以，这一切都是出于设计。盖伊·贝德福德（Guy Bedford）在他的博客上写到了这一点，并引用了NodeJS正在进行的模块标准化：

。。。导入文件时将不再允许命名导出 CommonJS模块来自ES模块，在

也就是说，

import{name}来自“cjs.js”

，其中

cjs.js

是一个通用的js 模块将不再受支持，而是需要

从“cjs.js”导入cjs；cjs.name

通过使用

\uu esModule

实现互操作解决方案：

我们将继续支持interop中的

\uu esModule

标志， 允许取消这些情况下的命名导出

因此，如果编写了

cjs.js

模块：

exports.__esModule = true;
exports.name = function () {  ... }

然后可以从“cjs.js”导入{name}，偶数 虽然

cjs.js

是一个常见的js模块，但是这个

\uu esModule

将 最终，从长远来看，我们也会反对这种做法

---

它不是解构，即使速记语法大致相同。

exports.__esModule = true;
exports.name = function () {  ... }