Laravel + Vue2.0 开发组件，模板使用时报错

laravel5.4 + vue2.0 开发组件，blade模板中使用的时候报错
错误如下图

app.js代码如下

/**
 * First we will load all of this project's JavaScript dependencies which
 * includes Vue and other libraries. It is a great starting point when
 * building robust, powerful web applications using Vue and Laravel.
 */

require('./bootstrap');
require('./main');

window.Vue = require('vue');

/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */

Vue.component('example', require('./components/Example.vue'));
Vue.component('comment-form', require('./components/CommentForm.vue'));
Vue.component('contact-form-submit', require('./components/ContactFormSubmit.vue'));

const app = new Vue({
    el: '#app'
});

ContactFormSubmit.vue代码如下

<template>
    <div>
        <div>dddddddd</div>
    </div>
</template>

<script>
    export default{
        mounted() {
            console.log('123')
        },
        data(){
            return{
                msg:'hello vue'
            }
        }
    }
</script>

编译的时候是通过的，但在blade模板中使用的时候，就报错了，这个是怎么回事？