尝试导入外部组件但返回错误答案

【问题标题】：trying to import a external component but returns error尝试导入外部组件但返回错误
【发布时间】：2021-04-18 13:01:06
【问题描述】：

我正在尝试将此组件导入我的 vue 页面

https://github.com/damienroche/vue-mj-daterangepicker

在我的 vue 页面的脚本元素的顶部，我有这个

import Vue from 'vue'
import DateRangePicker from 'vue-mj-daterangepicker'
import 'vue-mj-daterangepicker/dist/vue-mj-daterangepicker.css'
Vue.use(DateRangePicker)

而且在我的导出默认值中我也有这个

components: {
    DateRangePicker
}

我的html

<date-range-picker from="2018-04-23T10:26:00.996Z" to="2019-04-23T10:26:00.996Z" panel="range" @update="update"/>

在网页上加载我的页面时出现此错误

[Vue warn]: Failed to mount component: template or render function not defined.

found in

---> <DateRangePicker>
   <BookingStatistics> at resources/assets/js/views/BookingStatistics.vue
     <Root>

【问题讨论】：

标签： vue.js

【解决方案1】：

DateRangePicker 是一个插件，可以全局注册组件，而不需要在 components 选项中注册：

import Vue from 'vue'
import DateRangePicker from 'vue-mj-daterangepicker'
import 'vue-mj-daterangepicker/dist/vue-mj-daterangepicker.css'
Vue.use(DateRangePicker)

直接使用<date-range-picker ... />无需：

~~components: { DateRangePicker }~~

【讨论】：