Vue webpack引入bootstarp

Vue webpack引入bootstarp

參考

2. 錯誤處理

安裝

1. 執行指令 npm install jquery --save-dev

2. 打開項目build目錄，向webpack.base.conf.js頭添加內容
   const webpack = require(‘webpack’)
   

3. 向module.exports 添加插件

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

   ],
   

4. 向main.js 添加 import $ from ‘jquery’

5. 啓動項目測試看jQuery是否引入，會報錯 ‘$’ is defined but never used
   翻譯意思是 已經被定義，但是未被使用
   解決：
   1. 使用jquery
   2. .eslintrc.js文件 rules添加規則： “no-unused-vars”: ‘off’
   

6. 安裝bootstrap： npm install bootstrap --save-dev

7. mian.js引入bootstrap

    import 'bootstrap/dist/css/bootstrap.min.css'
    import 'bootstrap/dist/js/bootstrap.min.js'
   

測試結果