VueにjQuery問題を導入:Bootstrap's JavaScript requires jQuery


最近勉強しています.js,VueにjQueryを導入するには2つの方式があり,1つはindexである.htmlにnode_を導入modulesのjqueryプラグインパッケージのjquery.js.
もう一つの方法はmainです.jsに導入され、ネット上の多くの紹介方法はwebpackである.config.jsのmodule.义齿
 new webpack.optimize.CommonsChunkPlugin('common.js'),
    new webpack.ProvidePlugin({
      $: 'jquery',
      jquery: 'jquery'
    })

しかし、Bootstrap's JavaScript requires jQueryのエラーは解決できません.
ここでは、公式サイトが最も権威のある参考になることをお勧めします.
様々な技術の更新が早すぎて、ネット上の技術ブログフォーラムで紹介されている方法は製品のバージョンが反復するにつれて使えないかもしれないので、必ず公式サイトを参考にしてください.公式サイトは英語ですが、効率が高いです.以下は公式サイトが提供する方法です:vueはjqueryを導入します
Vue導入jQuery:
1.expose-loaderをダウンロードする:
npm install expose-loader --save-dev
2.Webpackでexpose-loaderを構成し、jQueryをグローバル名$:
// webpack.config.js
module: {
  rules: [{
    test: require.resolve('jquery'),
    use: [{
      loader: 'expose-loader',
      options: '$'
    }]
  }]
}

3. Let's say you also want to expose it as  window.jQuery  in addition to  window.$ . For multiple expose you can use  !  in loader string:
Windowsとして公開したいならjQueryかwindow.$、次のように構成できます.
// webpack.config.js
module: {
  rules: [{
    test: require.resolve('jquery'),
    use: [{
      loader: 'expose-loader',
      options: 'jQuery'
    },{
      loader: 'expose-loader',
      options: '$'
    }]
  }]
}

4.そしてmain.js中
import $ from 'jquery'     //  jquery
import '../node_modules/bootstrap/dist/css/bootstrap.css'
import '../node_modules/bootstrap/dist/js/bootstrap.js'

new Vue({
  el: '#app',
   $,               //  $
  render: h => h(App)
})

5.chromeのコンソールに入力:
console.log(jQuery)

間違いを報告することはありません.Bootstrap's JavaScript requires jQueryはこのように解決できます.
参照リンク:
Webpackでexpose-loaderが使用