在vue-cli專案中引入jQuery和bootstrap
最近想用vue+jquery+bootstrap做一個專案,剛開始不知道怎麼引入jQuery和bootstrap,弄了小半天,終於弄好了,特此記載一下過程
1、首先,安裝jQuery
npm install jquery --save
2、 然後在build/webpack.base.config.js中新增以下程式碼
var webpack = require('webpack')
3、然後在module中新增以下程式碼
plugins: [
new webpack.ProvidePlugin({
$: "jquery",
jQuery: "jquery",
jquery: "jquery",
"window.jQuery": "jquery"
})
]
4、在main.js中引入jQuery
import $ from 'jquery'
5、安裝bootstrap
npm install bootstrap --save
6、在main.js中引入bootstrap相關檔案
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'
最後,重啟伺服器
注意:我重啟伺服器之後,有報錯,提示安裝popper.js,安裝即可,然後就可以正常啟動了