vue-cli如何引入bootstrap工具
以下操作以正常安裝node環境為前提。
1.引入jq:
在npm控制臺中,進入項目目錄,然後輸入指令npm install jquery --save-dev(npm換成cnpm更好,國內環境下使用cnpm下載速度更快)。
2.修改build目錄下的webpack.base.conf.js配置文件:
1)加入webpack對象:var webpack=require(‘webpack‘);
2)在module.exports裏面加入以下配置:
plugins: [
new webpack.ProvidePlugin({
$:"jquery",
jQuery:"jquery",
"windows.jQuery":"jquery"
})
]
3)在入口文件main.js中加入:import jquery from ‘jquery‘
3.引入bootstrap:
1)修改webpack.base.conf.js文件:
‘vue$‘: ‘vue/dist/vue.esm.js‘,
‘@‘: resolve(‘src‘),
‘assets‘: path.resolve(__dirname, ‘../src/assets‘),
‘jquery‘: "jquery/src/jquery"
}
2)在入口文件main.js中加入:
import ‘./assets/css/bootstrap.min.css‘
import ‘./assets/js/bootstrap.min‘
3)在assets文件目錄中拷貝bootstrap各種文件:
vue-cli如何引入bootstrap工具