Question

我正在尝试使用webpack捆绑我的所有类和模块，但是遇到一些问题。我尝试了许多解决方案，但失败了。我有以下模块，这是webpack的入口，我正在此模块中导入其他模块和类。

MyModule.js

import {utilities} from "./Utilities.js";   //which is a module
import myClass from "./MyClass.js";   //which is a class
import myObject from "./MyObject.js";   //which is a javascript object

var myModule = (function(){

    function myFunc(){ ...}

    return {
        myFunc:myFunc
    };
})();

Utilities.js

export var utilities = (function(){
   //code lines
})();

MyClass.js

export class myClass {
   //code lines
}

MyObject.js

export var myObject = {
   prop1:"xyz",
   prop2:"pqr"

}

webpack.config.js

module.exports = {
entry: './MyModule.js',
    output: {
      path: './dist',
      filename: 'bundle.js',
      libraryTarget: 'var',
      library: 'MyModule'
    }
};

这些都是我的JS文件。我在点击 Test.html

中的按钮时呼叫myModule.myFunc()

Test.html

<script src="dist/bundle.js">
<button onclick="myModule.myFunc()">Test</button>

点击按钮后，我得到了一个错误， typeError：myModule.myFunc不是函数。

如果我做错了什么，请纠正我。

如何使用webpack将javascript类和模块捆绑在一起？

0 个答案: