vue中使用bootstrap和jQuery

在vue项目中，有的时候对于一些操作需要用到jQuery或者在项目中使用bootstrap时，需要做如下准备：

一、在项目中使用jQuery：

　　1、需要安装 jQuery

　　　　npm  install  jquery -- save    (其中的 install 可以简写为 i)

　　2、配置 vue.config.js 文件

             如果没有该文件，可以在 main.js 的同级目录手动创建该文件

　　　  文件的配置如下：

　　　　　const webpack = require("webpack")    //  没有该插件需下载

　　　　　module.exports = {

　　　　　　　configureWebpack:{

　　　　　　　　plugins: [

　　　　　　　　　　new webpack.ProvidePlugin({

　　　　　　　　　　　　$ : "jquery",

　　　　　　　　　　　　jQuery : "jquery",

　　　　　　　　　　　　"window.jQuery" : "jquery" 

　　　　　　　　　　})

　　　　　　　　]

　　　　　　　}

　　　　　}

二、在项目中使用bootstrap

　　1、 安装 bootstrap，其有很多的组件依赖于 jQuery 和  popper

　　　　执行 npm install jquery bootstrap popper.js --save

　　       注意：bootstrap 默认安装的是 v4, 想安 v3,  使用  bootstrap@3

　　2、 配置 vue.config.js 文件

　　　　文件的配置内容在配置 jQuery 的基础上在 new webpack.ProvidePlugin 中增加一项  Popper: ["popper.js","default"]

　　3、 配置 main.js 文件

　　　　在文件中引入   import 导入bootstrap

　　　　bootstrap.css 需要单独引入