Javascript Vue js-获取未捕获的引用错误：未定义jQuery

我是Vue.js新手，正在尝试创建使用jQuery插件的自定义组件。当我将组件文件包含在另一个组件中时，我得到一个错误：

未捕获引用错误：jQuery未在/resources/js/form-builder.min.js中定义

我创建了一个名为

formBuilder.vue

的自定义组件。以下是组件代码：

//导入“./jquery.min.js”；
//导入“./jqueryui.min.js”；
//导入“./form builder.min.js”；
导出默认值{
创建（）{
},
数据（）{
返回{
}
},
安装的（）{
jQuery（this.$el）.formBuilder（）；
},
方法：{
}
}

在

app.js

文件（位于

resource/js/app.js

中）中，我将此vue称为其他组件递归使用的vue：

window.Vue=require（'Vue'）；
需要（'./引导'）；
要求（'admin-lte'）；
要求（'./datatable'）；
从“./router”导入路由器；
从“vuejs日期选择器”导入日期选择器；
从“ckeditor4 vue”导入CKEditor；
从“vue完整日历”导入完整日历；
导入“fullcalendar/dist/fullcalendar.css”
从“Vue”导入Vue；
从“jQuery”导入jQuery
导入“./form builder.min.js”；
Vue.use（VueRouter）
Vue.use（完整日历）；
Vue.use（CKEditor）
组件（“Vue日期选择器”，日期选择器）；
组件（'FormBuilder'，require（'./components/tools/FormBuilder.Vue'）。默认值）；
const app=新的Vue({
el:“#应用程序”，
路由器
});

这是我使用formbuilder组件的组件文件

  <template>
    <div class="content-wrapper">
        <div class="content-header">
            <div class="container-fluid">
                <div class="row mb-2">
                    <div class="col-sm-6">
                        <h1 class="m-0 text-dark">Questionnaire</h1>
                    </div>
                    <div class="col-sm-6"></div>
                </div>
            </div>
        </div>
        <div class="content">
            <div class="container-fluid">
                <div class="row justify-content-center">
                    <div class="col-md-12">
                        <div class="card">
                            <FormBuilder/> <!--- used formbuilder component --->
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>
<script>
    export default {
        created() {
        },
        data() {
            return {

            }
        },
        methods: {

        }
    }
</script>

问卷调查
导出默认值{
创建（）{
},
数据（）{
返回{
}
},
方法：{
}
}

我也附上了错误

你们能帮我找出哪里做错了吗

---

提前感谢。

将对象导入Vue的app JS不会自动生成该对象供其他组件使用

至少有两种方法可以做到这一点（尽管我建议避免所有这些，只需在需要它的组件中导入

jQuery

）：

选项1:

Vue.prototype

在应用程序JS中，在导入jQuery后，将其添加到

Vue

原型中，这将使每个组件都可以使用语法

this.jQuery

：

Vue.prototype.jQuery = jQuery

window.jQuery = jQuery

选项2:

窗口

对象

或者，您可以在导入后将其添加到窗口对象，并像

window.jQuery

那样使用它：

Vue.prototype.jQuery = jQuery

window.jQuery = jQuery

选项3：个别进口

只需将其导入使用它的组件中，可能更具可读性/可维护性：

import jQuery from 'jquery'

---

然后您可以将其与示例中的语法一起使用。

这是否回答了您的问题？