vue项目中如何安装jquery答案

【问题标题】：How to install jquery in vue projectvue项目中如何安装jquery
【发布时间】：2020-02-27 23:27:40
【问题描述】：

我创建了一个 laravel 6 项目并设置了前端预设 vue，并使用 bootstrap.Ex:Navbar 和 Modal 创建了一些 vue 组件，当我尝试使用 $('#modalName').modal('show'); 打开模态时什么也没发生

所以我认为这是一个 jquery 问题。我已经使用 (npm install) 安装了 bootstrap 和 jquery

这是我的 bootstrapjs

try {
    window.$ = window.jQuery = require('jquery');
    require('bootstrap');
} catch (e) {
}
window.axios = require('axios');
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
let token = document.head.querySelector('meta[name="csrf-token"]');
if (token) {
    window.axios.defaults.headers.common['X-CSRF-TOKEN'] = token.content;
} else {
    console.error('CSRF token not found: https://laravel.com/docs/csrf#csrf-x-csrf-token');
}

还有appjs

window.Vue = require('vue');
import App from './components/App';
const app = new Vue({
    el: '#app',
    template:'<App/>',
    components: {App}
});```

error message not found the modal function

`$(..).modal('show');`

【问题讨论】：

默认情况下，我相信Vue 附带JQuery 虽然我不知道您使用的版本。
您的错误消息指出，modal 函数未找到，jquery 已经可供您使用。
您是否在主刀片文件中包含 app.js ？

标签： jquery laravel vue.js

【解决方案1】：

我找到了一个解决方案，Laravel 6 有一个新的 UI 包。首先，我们需要安装这个包并且所有文件都可以正常工作。

【讨论】：

【解决方案2】：

在您的 app.js 中，您没有包含 bootstrap.js，这就是它不起作用的原因。

在顶部的app.js中包含boostrap.js，如下所示

require('./bootstrap');

如果我们不导入它，那么axios 也将不起作用，因为它是在 bootstrap.js 中导入的，而 app.js 中不包含它

【讨论】：