Vue JS应用程序无法显示页面

我是vue js应用程序的新手。我正在使用visual studio 2017创建vue js应用程序。我正在学习教程,但是当我运行应用程序时,在node js控制台窗口中出现了以下错误…

**var vue_det=新的vue({**//vue_det已分配但从未使用..

这是app.vue的代码…

<template>
    <div id="app">
        <Home msg="Hello world!" />
    </div>
</template>

<script>
    import Home from './components/Home.vue';
    import component1 from './components/component1.vue';

    export default {
        name: 'app',
        components: {
            Home,
           component1

        }

    };


</script>

<style>
</style>

这是component1.vue的代码…

<template>
        <div id="intro" style="text-align:center;">
            <h1>{{ message }}</h1>
        </div>


</template>

<script type = "text/javascript">
    import Vue from 'vue'; 
         var vue_det = new Vue({
            el: '#intro',
            data: {
               message: 'My first VueJS Task'
            }
         });
      </script>

<style scoped>
</style>

这是我运行应用程序时错误的屏幕截图。