#javascript #npm #plugins #vuejs2
#javascript #npm #Плагины #vuejs2
Вопрос:
Я пытаюсь использовать компоненты vuetify внутри моего пользовательского плагина vue, который я создал, но, похоже, мой плагин отрисовывается до того, как приложение «узнает», что vuetify существует.
я пытался использовать Vue.use (Vuetify) внутри моего плагина, но это не сработало, и, по сути, нет смысла использовать его в моем плагине, поскольку я хочу, чтобы пользователь плагина (разработчик) использовал vuetify в качестве глобальной зависимости в своем приложении, чтобы он мог просочиться в мой плагин
это мой html-шаблон плагина vue:
<v-content>
<v-container fluid fill-height>
<v-layout justify-center>
<div v-if="videoLoading">
<v-progress-circular v-if="useVuetifyLoader"
:size="size"
:width="width"
:rotate="rotate"
:value="videoLoadingProgress*1.5"
:color="color"
>
Downloading...
{{ `${loadedInMB}/${totalInMb}Mb` }}
</v-progress-circular>
<div v-else>
Downloading...
{{ `${loadedInMB}/${totalInMb}Mb` }}
</div>
</div>
<div v-else>
<div>
<div>foo</div>
</div>
</div>
</v-layout>
</v-container>
</v-content>
и это мой плагин :
import MyPlugin from '../lib/MyPlugin.vue';
import Vuetify from 'vuetify'
const install = function (Vue, config) {
Vue.component("my-plugin", MyPlugin)
}
export { install }
*and i tried also :*
import MyPlugin from '../lib/MyPlugin.vue';
import Vuetify from 'vuetify'
const install = function (Vue, config) {
Vue.use(Vuetify)// <-- did not work
Vue.component("my-plugin", MyPlugin)
}
export { install }
и когда я внедряю свой плагин в другое приложение, я получаю эти ошибки:
Unknown custom element: <v-content> - did you register the component correctly? For recursive components, make sure to provide the "name" option
Unknown custom element: <v-container> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
Unknown custom element: <v-layout> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
Unknown custom element: <v-progress-circular> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
Ответ №1:
Как насчет настройки вашего плагина таким образом и включения пользовательских компонентов внутри:
export default {
install (Vue, options) {
Vue.anyMethodYouLike = (value) => value
Vue.component('v-content', Component);
// Add `Vue.mixin()` to inject options to all components.
Vue.mixin({
// Add component lifecycle hooks and/or properties.
created() {
}
});
// We can also add Vue instance methods by attaching them to Vue.prototype.
Vue.property.$myProperty = 'This is a Vue instance property.'
}
}
Затем используйте в своем приложении, например:
import myPlugin from './plugin.js' // the file with the code above
Vue.use(myPlugin, {
someProp: 'blahdy blah' //options to pass
})
Ответ №2:
хорошо, итак, я понял это. все, что мне нужно было сделать, это передать Vuetify в качестве параметра в объекте options, а затем я мог бы использовать его в своем файле плагина с помощью Vue.use(my_vuetify_param)