如何在vue-cli使用bootstrap框架
阿新 • • 發佈:2019-01-13
一般來說,如果你只使用bootstrap框架的樣式,就直接把js那個資料夾刪掉,再把它們放進一個資料夾下,如src/assets,當然你也可以自己建立一個放置共用東西的資料夾。
然後在src/main.js裡面把它import進去就行了,如:import './assets/bootstrap/css/bootstrap.min.css'。這是最簡單的解決方案了。
但是你要使用裡面的一些特效,就會使用JS。bootstrap框架的js來源於jq框架,所以你還得安裝支援jq語法的依賴,在命令列輸入(c)npm install JQuery --save-dev,推薦使用cnpm國內淘寶映象,下載速度快,不要翻牆。當然你也可以直接寫進package.json,直接npm install。然後在bulid檔案下找到webpack.base.conf.js。在上面加var webpack = require('webpack')。在下面的module.exports裡面加入:
plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"windows.jQuery":"jquery"
})
]
然後在main.js裡面import進來就行了,如import $ from 'jquery'。如果是區域性安裝的直接用相對路徑。
如果有使用eslint語法檢測,找到eslintigore資料夾,把bootstrap裡的JS資料夾忽略掉。