javascript - 揭示模块模式和 webpack

Question

我在 module1.js 文件中有这样的示例模块:

export const Module1 = (function() {

    'use strict';

    function init()
    {
        console.log('init');
    }

    return {
        init: init
    };

}());

在 bootstrap.js 文件中我有:

require('./module1');

在app.js中我使用:

require('./boostrap');

$(function() {
    Module1.init();
});

但我得到:

Uncaught ReferenceError: Module1 is not defined

当我尝试启动时也是如此:

Module1.init();

在bootstrap.js

以防万一 - 我不是 JavaScript 专家，所以如果需要奇特的解决方案，请逐步向我解释这里出了什么问题。我用Laravel mix在 webpack 的底层，我不使用 webpack 的任何自定义配置。

Answer 1

我尝试了不同的场景，似乎解决方案是这样做的:

const Module1 = (function() {

    'use strict';

    function init()
    {
        console.log('init');
    }

    return {
        init: init
    };

}());

export default Module1;

然后在 bootstrap.js 中包含它，如下所示:

import Module1 from './module1';

在 bootstrap.js 中我可以运行:

Module1.init();

但是它并不能使 Module1.init() 在 app.js 中工作，所以我最终从 boostrap.js 中删除了这个导入code> 现在我的 app.js 看起来像这样:

require('./boostrap');
import Module1 from './module1';

$(function() {
    Module1.init();
});