我建立了一个
为此,我需要构建一个基本的没有
我把
如果我在Vue脚本中不使用组件,页面可以正常工作(Vue正常工作)。但是,当我使用组件时,页面显示此错误
有什么想法或建议吗?
Vue组件
,它被打包到 "build-bundle": "vue-cli-service build --target lib --name my-component ./src/myComponent.vue"
中。在dist
文件夹中,我有:
- demo.html
- my-component.common.js
- my-component.udm.js
- my-component.udm.min.js
GitHub Page
上发布,我正在建立一个页面来说明该组件的详细信息和特点。我将使用一个根目录为 /docs
的文件夹作为 GitHub Page
(我不想使用gh-pages
分支)。为此,我需要构建一个基本的没有
Vue CLI
、Webpack
等的 Vue
应用程序。
index.html
如下所示:<!DOCTYPE html>
<html lang="en">
<head>
...
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
<script src="js/my-component.umd.js"></script>
...
</head>
<body>
...
<div id="app">..</div>
...
<script type="module">
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
},
components: {
myComponent: my-component
}
})
</script>
</body>
</html>
我把
dist/my-component.umd.js
复制到docs/js
文件夹中,以便拥有一个独立的文件夹。如果我在Vue脚本中不使用组件,页面可以正常工作(Vue正常工作)。但是,当我使用组件时,页面显示此错误
(index):199 Uncaught ReferenceError: vue is not defined
,直接指向myComponent: my-component
。有什么想法或建议吗?
my-component
本身不是一个有效的标识符; 它是一个二进制表达式my - component
。这可能会导致引用错误。请尝试使用window['my-component']
。 - Christian C. Salvadówindow['my-component']
- Yann Masochwindow['my-component']
或者重新打包具有有效名称(例如myComponent
-myComponent.umd.js
)的组件。请在下面编写您的答案/解决方案,我会进行验证。 - Yann Masoch