Глобально определить компоненты Nuxt JS / Vue - PullRequest
Новая
       58

Глобально определить компоненты Nuxt JS / Vue

0 голосов
/ 20 апреля 2020

Я создаю сайт с Nuxt. Компоненты и содержимое страницы загружаются из CMS в asyncData.

Я хотел бы объявить повторно используемые компоненты глобально, чтобы мне не приходилось импортировать их 10 раз, и я могу изменить сайт с помощью CMS.

Итак, моя страница выглядит следующим образом: 

<template>
  <div class="container">
    <component v-bind:is="blok.component" v-for="blok in page.body" :key="blok._uid" :content="blok" />
  </div>
</template>

<script>
export default {
    async asyncData (context) {
        const page = await context.app.$storyapi.get('cdn/stories/home/', {
            version: 'published'
        })
        return {
            page: page.data.story.content
        }
    }
}
</script>

У меня есть компоненты. js файл, расположенный в папке / plugins 

import Hero from '~/components/home/hero.vue'

Vue.component('hero', Hero.default)

и в nuxt.config. js

    plugins: [
        { src: '@/plugins/components', ssr: false }
    ],

Я все еще получаю эту ошибку 

<hero> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

Кто-нибудь знает, как объявить их глобально?

...