问如何构建一个可以直接在页面上使用的JS模块？
EN

Stack Overflow用户

提问于 2019-10-09 17:04:52

回答 1查看 25关注 0票数 1

我是vue-sequence的作者。这个库是用vue-cli构建的，它以umd格式导出库。要使用这个库，我必须使用webpack使其在网页上工作，如下所示：

import { SeqDiagram, Store } from "vue-sequence";
...
Vue.use(vuex);
Vue.component("seq-diagram", SeqDiagram);
let store = new vuex.Store(Store);

在这里可以找到使用它的完整示例：https://codesandbox.io/s/5v4v78w1wk。

我希望能够在页面上直接使用它(但仍然支持将其用作节点模块)，例如：

<script src="vue-sequence.js" />

<script>
vueSequence.processAll()
</script>

我知道我需要在某个地方定义这个processAll()方法。我的问题是如何打包这个库。

发布于 2019-10-09 19:25:22

我试过一些方法。我想我知道umd是如何工作得更好的。如果我们在网页上直接包含umd库，库将在全局window变量上创建一个字段(在本例中为vue-sequence，可通过窗口‘’vue sequence‘引用)。

使用下面的html配置

<title>vue-sequence demo</title>
<script src="./vue-sequence.umd.js"></script>

<script>
console.log(window['vue-sequence'])
</script>

它将打印出导出的模块。了解了这一点就足以让我继续研究添加processAll()函数的解决方案。

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/58300610

复制

相似问题

问如何构建一个可以直接在页面上使用的JS模块？EN