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了