使用electronic-vue（带有电子的vue.js）时，文件列表而不是渲染页面

Question

我对vue.js和electronic非常陌生。 我正在尝试使用一些JavaScript渲染页面。 所以我有这些.vue文件或组件。 据我所知，这些只能包含一个脚本标签。 因此，每当我向脚本中添加任何内容时。 该应用程序中断并向我显示一个向我显示文件的目录

如果我不修改dashboard.vue中的脚本，这就是应用程序终止的方式

如果我更改了dashboard.vue的脚本中的任何内容，这就是它的原因

信息中心暂时不包含任何脚本。 但是，当我添加脚本标签时，会发生此问题。

我的仪表板脚本是

<script>
export default {
  name : 'Dashboard',
  data(){
    return  {
      msg : "Welcome"
    }
  }
}
</script>

这就是路由器的配置方式。 如果我在dashboard.vue中没有脚本标签，它会很好地工作

Vue.use(Router)

export default new Router({
  routes: [
    {
      path: '/',
      name: 'Dashboard',
      component: require('@/components/Dashboard').default
    },
    {
      path: '/Products',
      name: 'Products',
      component: require('@/components/Products').default
    },
    {
      path: '*',
      redirect: '/'
    }
  ]
})

我想知道为什么会发生此错误。 从Vue路由器加载仪表板时，我需要运行一些脚本。 我尝试查找此问题。 我什么都找不到。 我对webpack和vue-loader也不太熟悉。 虽然我已经阅读了文档。