0

Я пытаюсь разбить компоненты по отдельным файлам, чтобы потом собирать их в одном компоненте и отрисовывать. main.js выглядит так:

import Vue from 'vue'
import App from './App.vue'
import './vuetify/vuetify.min.css'
import top_menu from './top-menu/top-menu.vue'

Vue.component("top-menu", top_menu)

new Vue({
  el: '#app',
  render: h => h(App)
})

App.vue выглядит так:

<template>
  <div id="app">
    <v-app id="inspire">
      <top-menu></top-menu>
    </v-app>
  </div>
</template>

В консоль выводится ошибка: Property or method "$vuetify" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property

Почему библиотеку не видно?

1 ответ 1

3

main.js:

import Vue from "vue";
import App from "./App";

import Vuetify from "vuetify";
import "vuetify/dist/vuetify.min.css";
Vue.use(Vuetify);

Vue.config.productionTip = false;

/* eslint-disable no-new */
new Vue({
  el: "#app",
  components: { App },
  template: "<App/>"
});

App.vue:

<template>
  <div id="app">
    <v-app id="inspire">
      <top-menu></top-menu>
    </v-app>
  </div>
</template>

P.S: Вы пропустили Vue.use(Vuetify);

Vueyify должно быть обязательно установлено!

Пример простейшего vue app с vuetify codesandbox

1
  • 1
    Спасибо за объяснение, сейчас буду пробовать 11 окт 2018 в 6:56

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.