webpack 引入 bootstrap，一

　　Bootstrap中是一种事实上的界面标准，标准到现在的网站大量的使用它。如果可以使用webpack引入的bootstrap，就可以一个npm install完成项目的依赖，而不必手工的添加到html内。

　　首先咱们在前端刚兴起的时候，是在html页面通过<script src=\'./js/bootstrap.js\'> <link href=\'./css/bootstrap.css\'>俩个标签引入bootstrap，在webpack中我们要引入它，也要分这俩个部分。

　　1、 npm install bootstrap --save-dev 或者使用淘宝镜像 cnpm install bootstrap --save-dev；

　　　　然后咱们在代码中引入bootstrap.js

　　　　import \'bootstrap/dist/js/bootstrap.js\';

　　　　打包然后会发现有一个错误，没有找到全局的 jquery，需要我们去包管理器中下载jquery-- npm install jquery--save-dev

　　　　配置plugins插件部分：

    plugins:[
        new webpack.ProvidePlugin({
            $: "jquery",
            jQuery: "jquery"
        })
        
    ]

　　　　在我们页面中输出一行 cosole.log($(document.body)) ; 可以看到输出内容是一个Jquery对象，说明jquery引入成功，但是bootstrap还是抛出了一个错误 “没有找到全局的 jquery”.其实我们可以换个思路，webpack是一个模块化打包工具，它打包的第三方模块是经过处理的，不会在全局创建一个接口，而bootstrap文件依赖于全局jquery，所以报错。

　　　　首先来介绍我最为推荐的方法：ProvidePlugin + expose-loader，

        plugins:[
                new webpack.ProvidePlugin({
                    $: "jquery",
                    jQuery: "jquery",
                    \'window.$\':\'jquery\',
                    \'window.jQuery\':\'jquery\'
                })
                
        ]    

　　　　　　　{
                test:require.resolve(\'jquery\'),
                loader:\'expose-loader?$!expose-loader?jQuery\'
            },

　　　　ProvidePlugin的机制是：当webpack加载到某个js模块里，出现了未定义且名称符合（字符串完全匹配）配置中key的变量时，会自动require配置中value所指定的js模块。

如上述例子，当某个老式插件使用了jQuery.fn.extend(object)，那么webpack就会自动引入jquery（此处我是用NPM的版本，我也推荐使用NPM的版本）。

另外，使用ProvidePlugin还有个好处，就是，你自己写的代码里，再！也！不！用！require！jQuery！啦！毕竟少写一句是一句嘛哈哈哈。

　　　　有了ProvidePlugin为嘛还需要expose-loader？问得好，如果你所有的jQuery插件都是用webpack来加载的话，的确用ProvidePlugin就足够了；但理想是丰满的，现实却是骨感的，总有那么些需求是只能用<script>来加载的。

　　　　第二部分 引入bootstrap.css

　　　　第三部分 打造webpack 自定义bootstrap

　　　　后续内容.....稍后