vue3全局導入bootstrap5方式

更新時間：2023年10月26日 09:42:51 作者：賏铘

這篇文章主要介紹了vue3全局導入bootstrap5方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教

vue3全局導入bootstrap5

安裝

npm install bootstrap --save-dev
npm install jquery --save-dev

在main.js中引入

// 引入jQuery、bootstrap
import 'jquery'
import 'bootstrap/dist/css/bootstrap.min.css'
import 'bootstrap/dist/js/bootstrap.min.js'

配置 jQuery

vue.config.js 中，寫如下代碼

const webpack = require("webpack")
 
module.exports = defineConfig({
  	// 配置插件參數(shù)
	configureWebpack: {
		plugins: [
			// 配置 jQuery 插件的參數(shù)
			new webpack.ProvidePlugin({
				$: 'jquery',
				jQuery: 'jquery',
				'window.jQuery': 'jquery',
				Popper: ['popper.js', 'default']
			})
		]
	}
})

這樣就可以使用啦

vue3全局導入bootstrap-icons問題

安裝

npm i bootstrap-icons

在min.js中導入

import "bootstrap-icons/font/bootstrap-icons.css";

總結(jié)

以上為個人經(jīng)驗，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

一文詳解WebStorm如何調(diào)試Vue項目
這篇文章主要介紹了如何使用WebStorm進行斷點調(diào)試,包括配置、啟動本地應用程序、設置斷點以及使用調(diào)試工具等步驟,文中通過圖文及代碼介紹的非常詳細,需要的朋友可以參考下
2025-02-02
使用?vite?external?減小產(chǎn)物體積的方法實現(xiàn)
本文主要介紹了使用?vite?external?減小產(chǎn)物體積,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧
2026-05-05
Nuxt頁面級緩存的實現(xiàn)
這篇文章主要介紹了Nuxt頁面級緩存的實現(xiàn)，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧
2020-03-03
vue文件代碼縮進以及格式化代碼方式[自定義]
這篇文章主要介紹了vue文件代碼縮進以及格式化代碼方式[自定義],具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教
2024-03-03
vue抽出組件并傳值實例
這篇文章主要介紹了vue抽出組件并傳值實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2020-07-07
vue3?錨點定位的多種實現(xiàn)方式
這篇文章主要介紹了vue3?多種方法的錨點定位，使用?Vue?Router?導航守衛(wèi)可以簡化導航邏輯、統(tǒng)一管理導航邏輯和進行權(quán)限控制，但需要學習和理解相關(guān)概念，并且需要手動編寫和管理導航守衛(wèi)的邏輯,本文給大家介紹的非常詳細，需要的朋友可以參考下
2023-07-07
vue中的嚴格模式如何取消
這篇文章主要介紹了vue中的嚴格模式如何取消，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-04-04
Vue.js第四天學習筆記
這篇文章主要為大家詳細介紹了Vue.js第四天的學習筆記，json數(shù)組數(shù)據(jù)以csv格式導出,具有一定的參考價值，感興趣的小伙伴們可以參考一下
2016-12-12
vue組件tabbar使用方法詳解
這篇文章主要為大家詳細介紹了vue組件tabbar使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2018-11-11
vue中template模板編譯的過程全面剖析
這篇文章主要介紹了vue中template模板編譯的過程全面剖析，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-04-04