vue中如何引入jQuery和Bootstrap
更新時(shí)間：2017年04月10日 15:43:25 作者：xiaofenguo
本篇文章主要介紹了vue中如何引入jQuery和Bootstrap，詳細(xì)的介紹了引入jQuery和Bootstrap的方法，有興趣的可以了解一下。
這兩天學(xué)習(xí)了Vue.js ，所以，今天添加一點(diǎn)小筆記。
一、引入jQuery
在當(dāng)前項(xiàng)目的目錄下（就是package.json），運(yùn)行命令 cnpm install jquery --save-dev 這樣就將jquery安裝到了這個(gè)項(xiàng)目中。
然后修改webpack.base.conf.js(在build文件下)兩個(gè)地方：
1：加入
var webpack=require('webpack');
2 在module.exports的里面加入
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
最后在main.js中加入import $ form 'jquery',完成jquery的引入
二、引入 bootstrap.css文件：
修改webpack.base.conf.js
resolve: {
extensions: ['.js', '.vue', '.json'],
alias: {
'vue$': 'vue/dist/vue.esm.js',
'@': resolve('src'),
'bootstrap':resolve('src/assets/bootstrap'),
}
},
在main.js中import引入
import 'bootstrap/js/bootstrap.min.js' import 'bootstrap/css/bootstrap.min.css'
三、引入bootstrap.min.js文件：
在main.js中import引入
import 'bootstrap/js/bootstrap.min.js'
以上就是本文的全部?jī)?nèi)容，希望對(duì)大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。
相關(guān)文章
這篇文章主要介紹了Vue 打包體積優(yōu)化方案小結(jié)，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-05-05
Vue.js實(shí)現(xiàn)文章評(píng)論和回復(fù)評(píng)論功能
這篇文章主要為大家詳細(xì)介紹了Vue.js實(shí)現(xiàn)文章評(píng)論和回復(fù)評(píng)論功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-04-04
這篇文章主要介紹了Vue的v-if和v-show的區(qū)別圖文介紹,本文通過(guò)示例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-03-03
這篇文章主要給大家介紹了關(guān)于Vue中ref和$refs使用方法的相關(guān)資料，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-01-01
vue+element+oss實(shí)現(xiàn)前端分片上傳和斷點(diǎn)續(xù)傳
這篇文章主要介紹了vue+element+oss實(shí)現(xiàn)前端分片上傳和斷點(diǎn)續(xù)傳，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
Vite項(xiàng)目搭建與環(huán)境配置的完整版教程
Vite?使用?Rollup?作為默認(rèn)的構(gòu)建工具,可以將應(yīng)用程序的源代碼打包成一個(gè)或多個(gè)優(yōu)化的靜態(tài)文件,本文就來(lái)為大家介紹一下Vite如何進(jìn)行項(xiàng)目搭建與環(huán)境配置吧2023-09-09
這篇文章主要介紹了Element PageHeader頁(yè)頭的使用方法，文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-07-07
vue在手機(jī)中通過(guò)本機(jī)IP地址訪問(wèn)webApp的方法
這篇文章主要介紹了vue在手機(jī)中通過(guò)本機(jī)IP地址訪問(wèn)webApp的方法,需要的朋友可以參考下2018-08-08
Vue ECharts簡(jiǎn)易實(shí)現(xiàn)雷達(dá)圖
這篇文章主要介紹了基于Vue ECharts簡(jiǎn)易實(shí)現(xiàn)雷達(dá)圖,本文通過(guò)實(shí)例代碼圖文相結(jié)合給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2022-12-12
vue中對(duì)虛擬dom的理解知識(shí)點(diǎn)總結(jié)
在本篇文章里小編給大家整理了一篇關(guān)于vue中對(duì)虛擬dom的理解知識(shí)點(diǎn)總結(jié)內(nèi)容，有興趣的朋友們可以學(xué)習(xí)參考下。2021-06-06