在vue.js中導入組件時出錯

Question

這可能是一個簡單的錯誤。 但是我是這個領域的新手。 我在這里收到關於意外令牌的語法錯誤：

component: () => import('@/layouts/default.vue'),

會是什么問題？

Answer 1

如果要將組件導入另一個模塊/組件，請在文件頂部使用此組件：

import MyComponent from '@/layouts/default.vue'

...假設您已將MyComponent導出為default.vue文件中的默認導出。

您可以將MyComponent更改為所需的任何內容。

Answer 2

我假設您正在使用獨立組件。 在這種情況下，請在default.vue文件中包括export default ，然后import DefaultComponent from '@/layouts/default.vue文件頂部的import DefaultComponent from '@/layouts/default.vue中import DefaultComponent from '@/layouts/default.vue 。 然后，在“組件”部分中包含DefaultComponent。

默認值

<template>
  <p>{{hi}}</p>
</template>
<script>
  export default{
    data: function(){
      hi: 'Hello World'
    }
  }
</script>
<style
</style>

主線

<template>
  <default-component></default-component>
</template>
<script>
  import DefaultComponent from '@layouts/default.vue';

  export default{
    components: {
      'default-component': DefaultComponent
    }
  }
</script>
<style
</style>