未使用 BabelLoader 定义的 JavaScript 模块答案

【问题标题】：JavaScript module not defined with BabelLoader未使用 BabelLoader 定义的 JavaScript 模块
【发布时间】：2018-08-09 01:04:40
【问题描述】：

我正在尝试将我编写的包导入到我编写的另一个包中。

Pre-Babel 加载器

class TestClass {
    constructor() {
        // Load flags on import here
        console.log("TESTING CONSTRUCTOR");
    }

    log(message) {
        console.log("TESTING LOG");
    }
}

export default new TestClass();

Post Babel 加载器

var TestClass = function () {
    function TestClass() {
        _classCallCheck(this, TestClass);

        // Load flags on import here
        console.log("TESTING CONSTRUCTOR");
    }

    _createClass(TestClass, [{
        key: "log",
        value: function log(message) {
            console.log("TESTING LOG");
        }
    }]);

    return TestClass;
}();

exports.default = new TestClass();

导入本身只是一个import TestClass from 'testclass-js'。但是，每次我尝试加载它时，我都会收到“Darklaunch 未定义”错误，并且无法调用该类的任何方法。

我想知道我在这里做错了什么。

【问题讨论】：

标签： javascript import export babeljs es6-modules

【解决方案1】：

如果您尝试导入 ES5/commonjs 版本，则需要导入 'yourmodule'.default；这种变化发生在 babel 6 左右

Babel 6 changes how it exports default

阅读有关原始问题的更多信息：https://github.com/babel/babel/issues/2212

如果你的包同时包含 es5 和 es6+ 版本，你可以在 package.json 中的 module 键中指向 es6 版本，webpack/rollup 会选择并捆绑它而不是 commonjs 版本

【讨论】：

我试过 require 但它似乎是未定义的。我想我必须将 require.js 加载到我的包中。我会深入研究原始问题，看看我发现了什么，谢谢。
看到上面写着exports.default，您可以假设exports 是一个对象，它对每个命名的导出都有一个键或者只是默认值。 const yourThing = require('your-module').default 可以，但不使用导入很烦人。这至少可以作为一个开始吗？
require 未定义，因为我在浏览器中使用它。不能直接使用。
啊，你没有使用打包工具吗？像 sourcetype="module" 并且只是本地导入？如果是这样，您可能也需要您的模块使用 ES6 导出，我从未尝试直接在浏览器中使用 babelified 模块
这是一个奇怪的设置。我正在做 React SSR，里面有模块，由 webpack 捆绑。