Vue 未定义
Vue is not defined
我正在尝试使用 Vue.js 构建一个演示应用程序。我得到的是 Vue 未定义的奇怪错误。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue JS Intro</title>
</head>
<body>
<div id="demo">
<p>{{message}}</p>
<input v-model="message">
</div>
<script type="JavaScript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.18/vue.min.js"></script>
<script>
var demo = new Vue({
el: '#demo',
data: {
message: 'Hello Vue.js!'
}
})
</script>
</body>
</html>
我在这里错过了什么？这不是CDN的问题，因为我也是从官方网站下载的库，使用它得到了相同的结果
index.html:15 Uncaught ReferenceError: Vue is not defined
- 您错过了顺序，第一个：
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.18/vue.min.js"></script>
然后：
<script>
var demo = new Vue({
el: '#demo',
data: {
message: 'Hello Vue.js!'
}
});
</script>
- 并且
type="JavaScript" 应该是 type="text/javascript"（或者什么都不是）
尝试在您的 vue.js 脚本标记中将 type="JavaScript" 修复为 type="text/javascript"，或者将其删除。
现代浏览器默认将脚本标签设为 javascript。
我需要将下面的脚本添加到 HEAD 标记内的 index.html。
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
但在您的情况下，由于您没有 index.html，只需将其添加到您的 HEAD 标签即可。
所以就像：
<!doctype html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
...
</body>
</html>
有时问题可能是如果您import这样：
const Vue = window.vue;
这可能会覆盖原来的 Vue 引用。
我收到此错误，但由于我包含 js 文件的方式未定义
最初我有
<script src="~/vue/blade-account-update-credit-card-vue.js" asp-append-version="true"></script>
<script src="~/lib/vue/vue_v2.5.16.js"></script>
在我的 .cshtml 页面的末尾
GOT 错误 Vue 未定义
但后来我把它改成了
<script src="~/lib/vue/vue_v2.5.16.js"></script>
<script src="~/vue/blade-account-update-credit-card-vue.js" asp-append-version="true"></script>
奇迹般地奏效了。所以我假设需要在 .vue
之上加载 vue js
我发现该实现有两个主要问题。首先，当您导入 vue.js 脚本时，您将 type="JavaScript" 用作 content-type，这是错误的。您应该删除此 type 参数，因为默认情况下 script 标签具有 text/javascript 作为默认 content-type。或者，只需将 type 参数替换为正确的 content-type 即 type="text/javascript".
第二个问题是您的脚本嵌入在同一个 HTML 文件中，这意味着它可能首先被触发并且可能尚未加载 vue.js 文件。您可以使用 jQuery 片段 $(function(){ /* ... */ }); 或添加 javascript 函数来解决此问题，如此处所示示例：
// Verifies if the document is ready
function ready(f) {
/in/.test(document.readyState) ? setTimeout('ready(' + f + ')', 9) : f();
}
ready(function() {
var demo = new Vue({
el: '#demo',
data: {
message: 'Hello Vue.js!'
}
})
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<p>{{message}}</p>
<input v-model="message">
</div>
只需将 text/javascript 放入您用于 cdn 的脚本标签中即可
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js" type="text/javascript"></script>
我遇到了同样的问题，出于一个奇怪的原因，包含 Vue 的 js 在 script 定义中有一个 defer：
<script src="js/app.js" defer></script>
这导致 script 加载比其他 js 文件异步加载。
我把defer标签去掉后，问题就解决了
对于那些在 vue 中的 src/main.js 文件中遇到此错误的人，
只需添加：-
var Vue = require('vue')
然后，它将正常工作。
我正在尝试使用 Vue.js 构建一个演示应用程序。我得到的是 Vue 未定义的奇怪错误。
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Vue JS Intro</title>
</head>
<body>
<div id="demo">
<p>{{message}}</p>
<input v-model="message">
</div>
<script type="JavaScript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.18/vue.min.js"></script>
<script>
var demo = new Vue({
el: '#demo',
data: {
message: 'Hello Vue.js!'
}
})
</script>
</body>
</html>
我在这里错过了什么？这不是CDN的问题，因为我也是从官方网站下载的库，使用它得到了相同的结果
index.html:15 Uncaught ReferenceError: Vue is not defined
- 您错过了顺序，第一个：
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.18/vue.min.js"></script>
然后：
<script>
var demo = new Vue({
el: '#demo',
data: {
message: 'Hello Vue.js!'
}
});
</script>
- 并且
type="JavaScript"应该是type="text/javascript"（或者什么都不是）
尝试在您的 vue.js 脚本标记中将 type="JavaScript" 修复为 type="text/javascript"，或者将其删除。
现代浏览器默认将脚本标签设为 javascript。
我需要将下面的脚本添加到 HEAD 标记内的 index.html。
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
但在您的情况下，由于您没有 index.html，只需将其添加到您的 HEAD 标签即可。
所以就像：
<!doctype html>
<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
...
</body>
</html>
有时问题可能是如果您import这样：
const Vue = window.vue;
这可能会覆盖原来的 Vue 引用。
我收到此错误，但由于我包含 js 文件的方式未定义
最初我有
<script src="~/vue/blade-account-update-credit-card-vue.js" asp-append-version="true"></script>
<script src="~/lib/vue/vue_v2.5.16.js"></script>
在我的 .cshtml 页面的末尾 GOT 错误 Vue 未定义 但后来我把它改成了
<script src="~/lib/vue/vue_v2.5.16.js"></script>
<script src="~/vue/blade-account-update-credit-card-vue.js" asp-append-version="true"></script>
奇迹般地奏效了。所以我假设需要在 .vue
之上加载 vue js我发现该实现有两个主要问题。首先，当您导入 vue.js 脚本时，您将 type="JavaScript" 用作 content-type，这是错误的。您应该删除此 type 参数，因为默认情况下 script 标签具有 text/javascript 作为默认 content-type。或者，只需将 type 参数替换为正确的 content-type 即 type="text/javascript".
第二个问题是您的脚本嵌入在同一个 HTML 文件中，这意味着它可能首先被触发并且可能尚未加载 vue.js 文件。您可以使用 jQuery 片段 $(function(){ /* ... */ }); 或添加 javascript 函数来解决此问题，如此处所示示例：
// Verifies if the document is ready
function ready(f) {
/in/.test(document.readyState) ? setTimeout('ready(' + f + ')', 9) : f();
}
ready(function() {
var demo = new Vue({
el: '#demo',
data: {
message: 'Hello Vue.js!'
}
})
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="demo">
<p>{{message}}</p>
<input v-model="message">
</div>
只需将 text/javascript 放入您用于 cdn 的脚本标签中即可
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js" type="text/javascript"></script>
我遇到了同样的问题，出于一个奇怪的原因，包含 Vue 的 js 在 script 定义中有一个 defer：
<script src="js/app.js" defer></script>
这导致 script 加载比其他 js 文件异步加载。
我把defer标签去掉后，问题就解决了
对于那些在 vue 中的 src/main.js 文件中遇到此错误的人，
只需添加：-
var Vue = require('vue')
然后，它将正常工作。