Javascript es6模块默认导出导入为未定义

我不确定我错过了什么。我正在使用jspm和es6模块加载器进行一个项目。我有一个模块定义如下：

import hooks from './hooks';
import api from './api';
import tools from './tools';

const StencilUtils = {
    hooks: hooks,
    api: api,
    tools: tools,
};

export {hooks, api, tools};
export default StencilUtils;

/* global define */
(function(root) {
    if (typeof define === 'function' && define.amd) {
        define(function() {
            return (root.stencilUtils = StencilUtils);
        });
    } else if (typeof module === 'object' && module.exports) {
        module.exports = StencilUtils;
    } else {
        window.stencilUtils = StencilUtils;
    }
}(this));

我正在将此模块导入另一个文件中，并像这样使用它：

import utils from 'bigcommerce/stencil-utils';

utils.hooks.on('cart-item-add', (event, form) => {
    // do stuff
});

当文件加载时，我得到一个错误，

utils

是

undefined

。如果我将文件更改为：

import {hooks} from 'bigcommerce/stencil-utils';

hooks.on('cart-item-add', (event, form) => {
    // do stuff
});

---

它工作正常。因此，默认的export语句似乎无法正常工作。导入或导出语句是否有明显的错误导致此问题？

我认为此问题有两个方面：

命名导出后，您可以通过导入为库或使用对象销毁来访问它们 方法1

xyz.js

abc.js

方法2

xyz.js

abc.js

那么你的情况呢

export {hooks, api, tools};

可以是

import * as utils from 'bigcommerce/stencil-utils';

或

默认导出语句不正确

它可以是

export default {
    hooks: hooks,
    api: api,
    tools: tools,
};

或

---

希望这对你有帮助。有关更多详细信息，请参见

没有明显的，没有。您碰巧在某个地方没有循环依赖关系，是吗？@Bergi我看不出来。我在

import utils

行之后立即放置了一个断点，并且变量未定义。我真的很困惑为什么会发生这种情况。是的，这听起来很像循环依赖。你能减少你的模块来创建一个完整的，可复制的例子吗？什么，一年内@Bergi's的循环依赖性建议没有投票权？！当我导入一些未定义的东西时，这完全是为了我。谢谢我认为这是不对的。根据文档（我想），我显示的默认导出语法很好，我尝试了您的第一个默认导出示例，但仍然没有解决问题。

import {* as myModule} from "xyz";
console.log(myModule.a);

export {hooks, api, tools};

import * as utils from 'bigcommerce/stencil-utils';

import {hooks} from 'bigcommerce/stencil-utils';

export default {
    hooks: hooks,
    api: api,
    tools: tools,
};

const StencilUtils = {
   hooks: hooks,
   api: api,
   tools: tools,
};
export { StencilUtils as default };