1. ホーム
  2. javascript

[解決済み】Vueが定義されていない

2022-02-07 23:33:13

質問内容

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

解決方法は?

jsBinデモ

  1. 順番を間違えている、最初に行く。

<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>

  1. そして type="JavaScript" であるべきです。 type="text/javascript" (いや、むしろ全くない)