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

Question

我是vue js应用程序的新手。我正在使用Visual Studio 2017创建vue js应用程序。我正在学习教程，但是当我运行应用程序时，在此行中的Node js Console窗口中出现了以下错误...。

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

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

Answer 1

这是错误提示。您可以阅读以下消息：

  

为vue_det分配了一个值，但从未使用过

请尝试将其删除

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