带有FullCalendar的VUEJS:仅在链接index.html中的脚本后才加载FullCalendar

Question

我想将FullCalendar加载到我的VUE组件中，但我会收到错误" FullCalendar不是函数"。似乎我在index.html文件中加载的所有脚本似乎都加载了vue组件

。

在我的index.html文件中，我加载了MONM.MIN.JS，JQUERY.MIN.JS和FULLCALENDAR.MIN.JS。

在我的日历中，我有

export default {
    mounted () {
        $('#calendar').fullCalendar({})
    }
}

除非我明确地从'jquery'进行"导入$"，

这表明index.html文件中的脚本要等到组件之后才加载。

。

如何解决此问题？

其他详细信息：我正在使用https://github.com/vuejs-templates/webpack提供的vuejs的webpack，因此我使用的是vuejs npm模块，而jquery，moment和fullcalendar库都来自CDN的链接。我的index.html。

Answer 1

一个不错的解决方案是使用vue-full-calendarhttps://www.npmjs.com/package/vue-fue-calendar

它会生成相同的行为，如果我们不添加以下行以定义jQuery" $"：

window.jQuery = window.$ = require('jquery')

Answer 2

假设您没有其他问题使您的fullCalendar功能不确定，则应该很容易地使其能够工作。由于您的捆绑包不包含jQuery，您只能指定您的捆绑包应该在最后加载，要么是：

• 将脚本标签放在身体的末端
• 或除了延期属性以外的任何地方使用： <script src="bundle.js" defer></script>
• 或将相关代码打包到window.onload = () => { //Instanciate here your new Vue() };中(如果将jQuery包含在捆绑包中，也可以工作！(

Answer 3

为我工作的唯一方法是从'jquery'导入$ quary'和require('fullcalendar'(