Message Vue is not defined

Question

I'm new to studying vue so my question may be kind of silly, but why am I getting the message "vue is not defined"? in this code:

<template>
    <div id="app">
        <input></input>
        <button>{{ textoBotao }}</button>
    </div>
</template>

<script>
    new Vue({
        data: {
            a: 1
        },
        created: function () {
            console.log('a é: ' + this.a)
        }
    })
    export default ({
        data() {
            return{
                textoBotao: 'Clique aqui'

            }
        }
    })

</script>

Answer 1

In your code, you don't need to create another instance of Vue. I can't imagine a situation where you need to create a new Vue instance in a single file component. Uou can use components if you need to encapsulate some functionality

If you do need to do this, you can use the following code:

import Vue from 'vue'
new Vue({
...
})

please see vue's official documentation and sample projects

Answer 2

Old question, but if someone needs it

If you have new Vue({}) in a js file and you load that js file before loading vuejs javascript file, you will get this error. This was the reason for my error.

Basically add /vue.min.js"> before you add other js files using vuejs

Hope it helps

Answer 3

I think You miss to add vue.js file, example:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.18/vue.min.js"></script>