webpack中引入bootstrap的一些填坑（明明已经引入了全局jquery环境，bootstrap样式却还是没有生效）

首先是正常的引入

npm run bootstrap

然后再是正常的配置环境
在webpack.base.conf.js中加入

var webpack = require('webpack')
//然后在module.exports加入以下代码，配置全局jquery环境
plugins: [
    new webpack.ProvidePlugin({
      $: "jquery",
      jQuery: "jquery"
    })
  ],

在main.js中引入bootstrap.min.css,bootstrap.min.css

import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'
//不用引入什么 import $ from 'jquery' 了，因为已经全局引入了

这个时候你可以运行一下你的项目了,在一个组件里面引入bootstrap样式

npm run dev // cnpm run dev //yarn run dev

问题来了，是不是很奇怪，你的样式并没有出来，然后你又去查找为什么已经配置好了全局jquery环境，bootstrap却还是没有生效，这里有一个大坑，首先你npm install bootstrap 的时候并没有规定版本，默认给你下载了最新版本

所以说这个时候你只需要把版本回退一下就好了

以上是bootstrap版本号

npm i bootstrap@3.3.7 --save-dev  //这里选择回退到3.3.7

最后再运行一下是不是出来了