通过Webpack进行Vue CLI和Bootstrap

时间:2018-01-02 17:04:36

标签: twitter-bootstrap webpack vue-cli

我试图让bootstrap与Vue CLI一起工作。 我像这样安装了jQuery和Bootstrap:

npm install jquery bootstrap

然后像这样配置webpack:

  module.exports = {
    plugins: [
      new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
        "window.jQuery": "jquery",
        tether: 'tether',
        Tether: 'tether',
        'window.Tether': 'tether',
        Alert: "exports-loader?Alert!bootstrap/js/dist/alert",
        Button: "exports-loader?Button!bootstrap/js/dist/button",
        Carousel: "exports-loader?Carousel!bootstrap/js/dist/carousel",
        Collapse: "exports-loader?Collapse!bootstrap/js/dist/collapse",
        Dropdown: "exports-loader?Dropdown!bootstrap/js/dist/dropdown",
        Modal: "exports-loader?Modal!bootstrap/js/dist/modal",
        Popover: "exports-loader?Popover!bootstrap/js/dist/popover",
        Scrollspy: "exports-loader?Scrollspy!bootstrap/js/dist/scrollspy",
        Tab: "exports-loader?Tab!bootstrap/js/dist/tab",
        Tooltip: "exports-loader?Tooltip!bootstrap/js/dist/tooltip",
        Util: "exports-loader?Util!bootstrap/js/dist/util",
      })
    ],
  }

虽然没有快乐。即使使用jQuery。

我正在寻找一个webpack解决方案。

谢谢, 杰米

1 个答案:

答案 0 :(得分:0)

main.jsapp.js内,无论您使用哪个主Javascript文件,请添加以下内容:

import 'bootstrap'
window.$ = window.jQuery = require('jquery')