nuxt引入component

在 Nuxt.js 中引入组件有以下几种方式：

1. 在页面中直接引入组件，例如：

   <template>
     <div>
       <MyComponent />
     </div>
   </template>

   <script>
   import MyComponent from '@/components/MyComponent.vue'

   export default {
     components: {
       MyComponent
     }
   }
   </script>

这里的 `@` 表示 `src` 目录，即 Nuxt.js 默认的资源目录。

2. 在布局中引入全局组件，例如：

   <template>
     <div>
       <Header />
       <nuxt />
       <Footer />
     </div>
   </template>

   <script>
   import Header from '@/components/Header.vue'
   import Footer from '@/components/Footer.vue'

   export default {
     components: {
       Header,
       Footer
     }
   }
   </script>

这里的 `nuxt` 表示页面组件的占位符，用于渲染页面组件。

3. 在插件中引入组件，例如：

   import Vue from 'vue'
   import MyComponent from '@/components/MyComponent.vue'

   Vue.component('MyComponent', MyComponent)

这里的 `Vue.component` 表示注册全局组件。在插件中注册的组件可以在所有页面和组件中使用。

希望能帮到你！