Vue js error: Component template should contain exactly one root element

I don’t know what the error is, so far I am testing through console log to check for changes after selecting a file (for uploading).

When I run $ npm run watch, i get the following error:

“Webpack is watching the files…

95% emitting

ERROR Failed to compile with 1 errors
19:42:29

error in ./resources/assets/js/components/File.vue

(Emitted value instead of an instance of Error) Vue template syntax
error:

Component template should contain exactly one root element. If you
are using v-if on multiple elements, use v-else-if to chain them
instead.

@ ./resources/assets/js/components/AvatarUpload.vue 5:2-181 @
./resources/assets/js/app.js @ multi ./resources/assets/js/app.js
./resources/assets/sass/app.scss”

My File.vue is

<template>
        <div class="form-group">
            <label for="avatar" class="control-label">Avatar</label>
            <input type="file" v-on:change="fileChange" id="avatar">
            <div class="help-block">
                Help block here updated 4 🍸 ...
            </div>
        </div>

        <div class="col-md-6">
            <input type="hidden" name="avatar_id">
            <img class="avatar" title="Current avatar">
        </div>
</template>

<script>
    export default{
        methods: {
            fileChange(){
                console.log('Test of file input change')
            }
        }
    }
</script>

Any ideas on how to solve this? What is actually the error?