未捕获的 ReferenceError:在 Index.html 中放置 vue 设置时未定义 Vue [英] Uncaught ReferenceError: Vue is not defined when put vue setting in Index.html
问题描述
我最近在学习vue
我有这个文件 main.js
import Vue from 'vue/dist/vue.js'
import Buefy from 'buefy'
import 'buefy/lib/buefy.css'
Vue.use(Buefy)
var App = new Vue({
el: '#app',
data: {
message : "It's working"
}
})
这是我的 html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Vue Example</title>
</head>
<body>
<h3 id="app">{{ message }}</h3>
<script src="dist/build.js"></script>
<script>
</script>
</body>
</html>
它正在工作.但是，现在我正在尝试用我的脚本做一些事情.我更改了 main.js(我使用的是 webpack)
It's working. But, now i'm trying to do something with my script. I change main.js (I'm using webpack)
import Vue from 'vue/dist/vue.js'
import Buefy from 'buefy'
import 'buefy/lib/buefy.css'
Vue.use(Buefy)
然后我的 index.html 到这个
then my index.html to this
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Vue Example</title>
</head>
<body>
<h3 id="app">{{ message }}</h3>
<script src="dist/build.js"></script>
<script>
var App = new Vue({
el: '#app',
data: {
message:"It's not working"
}
})
</script>
</body>
</html>
我收到这个错误
未捕获的引用错误:未定义 Vue
Uncaught ReferenceError: Vue is not defined
我该如何解决这个问题?
How can i fix this ?
推荐答案
如果你想直接在 index.html 中创建一个 Vue 的新实例，你应该包括index.html 中的库:
If you want to make a new instance of Vue directly in index.html you should either include the library in your index.html:
<script src="https://unpkg.com/vue@2.4.2"></script>
或者你需要像这样将 Vue 分配给 main.js 中的 window 对象:
Or you need to assign the Vue to window object in main.js like so:
main.js:
import Vue from 'vue';
window.Vue = Vue;
然后在 index.html 中您可以访问 Vue() 因为它是 window 对象的全局属性.
then in index.html you have access to Vue() because it is a global property of window object.
这篇关于未捕获的 ReferenceError:在 Index.html 中放置 vue 设置时未定义 Vue的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
