vue----响应式布局boostrap

首先在vue项目中安装boostrap和jquery

npm install bootstrap@3.3.0

npm install jquery@2.2.3

然后在main.js中引用

// 导入bootstrap
import "bootstrap"
import "bootstrap/dist/css/bootstrap.css"
// 导入jquery
import $ from 'jquery'

引用jquery还需要创建一个文件才能引用,因为我的vue-cli是3.x的,所以需要自己创建vue.config.js文件

在文件中写下面的语句:

const webpack = require('webpack')

module.exports = {
    configureWebpack: {
      plugins: [
        new webpack.ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery',
            'window.jQuery': 'jquery',
            'window.$': 'jquery'
        })
      ]
    }
}

之后便可以使用boostrap和jquery了