首先你是要引用bootstrap，肯定是用它的css部分，也可能连它的js部分也想用；
但是你别以为用 import 'bootstrap' 就可以了；
如果你这么用 马上报错 jQuery is not defined
解答原因：
1、直接 import 'bootstrap' 进来的只有 bootstrap的js部分，这里肯定没有css。
2、bootstrap的js部分需要 jquery的支持（他的transition.js文件会先报这个错，你可以打开node_modules/bootstrap/js/transion.js文件看一下）
上面我已经给出了为什么报这个错误的原因，下面我会对具体原因进行解答
1、为什么没有bootstrap 的css部分，而只是js部分
1、我们很习惯用 import 'jquery' 、import 'react' 等等框架和插件；但是它们引进来的都是js，而bootstrap也是直接引进来的只有js部分；因为CommonJS AMD操作的是js。可不能操作纯css部分，所以你只能找到js部分。（这里虽然没有用require引入但是直接用import 某插件 import会全局查找符合的条件的插件）
哪会有有人问我们这么能引入css部分呢，很简单；（根据你的目录层级直接找到node_modules中显示的引用即可以了，最后打包时也只是把该部分给打包进来了，如果觉得不好看，在全局配置一下，将路径映射替换一下）
import '../../../node_modules/bootstrap/dist/css/bootstrap.min.css'
import很类似node.js文件操作模块fs的功能；静态的引入某目录下的文件；
但是我告诉你这么引入还会报错：某些文件找不到。其实是bootstrap中引入的字体找不到；
所以你有两种办法：1、删除bootstrap源码中的字体引入的部分；2、把字体这部分也给引入进来；
2、怎么解决这个问题呢（如果你需要bootstrap的js部分）
bootstrap不是需要jQuery，我们给它就可以，怎么给
唯一的方法（不包括在打包框架中的全局配置jQuery）
var $ = window.jQuery = require("jquery")
require("bootstrap")
这个错误就解决了。你要引入css部分还是上面那个方法
为什么是唯一的；
如果你先这么写，哪错了
import jQuery from "jquery"
window.jQuery = $
import 'bootstrap'
因为require和import 在引入文件时一个是动态化的一个是静态引入
import 静态引入会导致 不能像require一样直接将jquery赋值到window上
并且import会变量提升将上面那个例子变成
import jQuery from "jquery"
import 'bootstrap'
window.jQuery = $按加载顺序bootstrap不能还是没有拿到全局的jQuery
网友评论