I've written an ES6 module that looks something like this:
export default function({makeCurrentVerUrl, verUrl, fileServer, downloadTokenType, appId}) {
...
}
When compiled by webpack, it looks something like this:
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;
...
};
/***/ }
]);
Which is great, but I'm not sure how to run this file and call my default function.
I can include it,
<script src="/path/to/script.js"></script>
Which I believe will run it automatically, but how can I call the functions I've defined in it from the browser? require
is not defined in my browser.
You can set output.library
in the configuration. From the 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 rootDefault:
"var"
Then you will be able to do
myLibrary()
So the easiest way to do this without changing output.library
(assuming you don't want to globalize everything ) is to just attach your needed functions to the window
. eg
// entry-point.js
import foo from './scripts/foo.js';
window.foo = foo;
Or if you want to attach a whole bunch of stuff to the window
(not just default
), you can do something like:
Object.assign(window, require('./scripts/somelib.js'));
You can also take a look at bundle-loader
, the built-in webpack feature require.context
or dynamic import()
s if you want to include some scripts at run-time.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.