javascript - 如何从 <script> 执行 webpack 模块？

Question

我写了一个 ES6 模块，看起来像这样:

export default function({makeCurrentVerUrl, verUrl, fileServer, downloadTokenType, appId}) {
    ...
}

用webpack编译的时候是这个样子的:

webpackJsonp([5,7],[
/* 0 */
/***/ function(module, exports) {

    'use strict';

    Object.defineProperty(exports, "__esModule", {
        value: true
    });

    exports.default = function (_ref) {
        var makeCurrentVerUrl = _ref.makeCurrentVerUrl;
        var verUrl = _ref.verUrl;
        var fileServer = _ref.fileServer;
        var downloadTokenType = _ref.downloadTokenType;
        var appId = _ref.appId;

        ...
    };

/***/ }
]);

这很好，但我不确定如何运行此文件并调用我的默认函数。

我可以包含它，

<script src="/path/to/script.js"></script>

我相信它会自动运行，但我如何从浏览器调用我在其中定义的函数？ require 未在我的浏览器中定义。

Answer 1

您可以在配置中设置output.library。来自docs :

output.library
If set, export the bundle as library. output.library is the name.

Use this, if you are writing a library and want to publish it as single file.

output.libraryTarget
Which format to export the library:

"var" - Export by setting a variable: var Library = xxx (default)

"this" - Export by setting a property of this: this["Library"] = xxx

"commonjs" - Export by setting a property of exports: exports["Library"] = xxx

"commonjs2" - Export by setting module.exports: module.exports = xxx

"amd" - Export to AMD (optionally named)

"umd" - Export to AMD, CommonJS2 or as property in root

Default: "var"

那么你就可以做

myLibrary()