位置: IT常识 - 正文

Vue3+Vite项目引入Bootstrap5、bootstrap-icons(vue引入mui)

编辑:rootadmin
Vue3+Vite项目引入Bootstrap5、bootstrap-icons Vue3+Vite项目引入Bootstrap5 \bootstrap-icons

推荐整理分享Vue3+Vite项目引入Bootstrap5、bootstrap-icons(vue引入mui),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:vue引入vconsole,vue 引入,引入vue.js,vue 引入,vue引入vconsole,引入vuex,vue引入vconsole,vue 引入,内容如对您有帮助,希望把文章链接给更多的朋友!

官方教程给出了bootstrap5.2和vite的使用方法。

安装Vue3+Vite项目引入Bootstrap5、bootstrap-icons(vue引入mui)

安装 Bootstrap、 Popper,因为 Bootstrap的下拉菜单、弹出框和工具提示都依赖于 Popper来定位。如果您不打算使用这些组件,则可以在此处省略 Popper。

npm i --save bootstrap @popperjs/core

安装额外的依赖Sass来正确导入和捆绑 Bootstrap 的 CSS。

npm i --save-dev sass 安装图标库 npm i bootstrap-icons

引入bootstrap样式文件

在assets目录下创建一个style.scss文件

// Import all of Bootstrap's CSS@import "bootstrap/scss/bootstrap";// 图标@import 'bootstrap-icons/font/bootstrap-icons.css';在入口文件main.ts/main.js中引入样式文件和JS文件import '/src/assets/styles.scss'import "@popperjs/core";import "bootstrap";跟其他ui库一样,可以按需引入import Alert from 'bootstrap/js/dist/alert';import { Tooltip, Toast, Popover } from 'bootstrap';这样就可以使用了。如果有什么问题您可以随时与我联系。

写文章不易,给个赞吧! 写文章不易,给个赞吧! 写文章不易,给个赞吧! 写文章不易,给个赞吧! 写文章不易,给个赞吧! 写文章不易,给个赞吧!

本文链接地址:https://www.jiuchutong.com/zhishi/283559.html 转载请保留说明!

上一篇:dlg.exe是什么 dlg.exe是病毒吗(dl是什么文件)

下一篇:玩游戏的显示器多大合适?多大尺寸的屏幕玩游(玩游戏的显示器要高刷还是高分辨率)

  • 网易手机账号怎么绑定将军令(网易手机账号怎么改成邮箱账号)

    网易手机账号怎么绑定将军令(网易手机账号怎么改成邮箱账号)

  • 抖音怎么查消费总金额   (抖音怎么查消费总金额)

    抖音怎么查消费总金额 (抖音怎么查消费总金额)

  • 电脑玩lol卡顿不流畅是什么原因(电脑玩lol卡顿不流畅应该加什么硬件)

    电脑玩lol卡顿不流畅是什么原因(电脑玩lol卡顿不流畅应该加什么硬件)

  • itunes怎么更新(iTunes怎么更新手机)

    itunes怎么更新(iTunes怎么更新手机)

  • 魅族多媒体声音拉不动(魅族音量键不能调节媒体音量)

    魅族多媒体声音拉不动(魅族音量键不能调节媒体音量)

  • 微信视频只能发15秒,能长一点吗(微信视频只能发10秒)

    微信视频只能发15秒,能长一点吗(微信视频只能发10秒)

  • 苹果手机还原网络设置会丢东西吗(苹果手机还原网络的密码是什么密码)

    苹果手机还原网络设置会丢东西吗(苹果手机还原网络的密码是什么密码)

  • 华为p40相机怎么调(华为p40相机怎么设置效果最好)

    华为p40相机怎么调(华为p40相机怎么设置效果最好)

  • mocor是什么系统(macos mojave是什么)

    mocor是什么系统(macos mojave是什么)

  • 怎么查12306一年订单(12306如何查询全年记录)

    怎么查12306一年订单(12306如何查询全年记录)

  • 微信收款音响s1和s2有什么区别(微信收款音响S1和F1的区别)

    微信收款音响s1和s2有什么区别(微信收款音响S1和F1的区别)

  • 华为荣耀手机辅助功能在哪里(华为荣耀手机辅助按键在哪里设置)

    华为荣耀手机辅助功能在哪里(华为荣耀手机辅助按键在哪里设置)

  • 泰捷盒子支持airplay吗(泰捷盒子支持开机自启吗)

    泰捷盒子支持airplay吗(泰捷盒子支持开机自启吗)

  • mdz18aa是几代(mdz-15-aa是第几代)

    mdz18aa是几代(mdz-15-aa是第几代)

  • 电脑超出频率限制(电脑超出频率限制是什么意思)

    电脑超出频率限制(电脑超出频率限制是什么意思)

  • 微信上面有个小耳朵(微信上面有个小耳朵是什么意思)

    微信上面有个小耳朵(微信上面有个小耳朵是什么意思)

  • word2007页码怎么弄(word2007页码怎么设置一左一右)

    word2007页码怎么弄(word2007页码怎么设置一左一右)

  • 趣步注销了怎么恢复(趣步注销找回)

    趣步注销了怎么恢复(趣步注销找回)

  • 手机淘宝勋章怎么领(手机淘宝勋章金币在哪里领)

    手机淘宝勋章怎么领(手机淘宝勋章金币在哪里领)

  • waf和防火墙的区别(wifi防火墙是什么)

    waf和防火墙的区别(wifi防火墙是什么)

  • 抖音如何升级(抖音如何升级荣誉等级)

    抖音如何升级(抖音如何升级荣誉等级)

  • 为什么苹果付款方式被拒绝(为什么苹果付款方式被拒)

    为什么苹果付款方式被拒绝(为什么苹果付款方式被拒)

  • 文件类型错误是什么原因详情(文件类型错误请重新选择)

    文件类型错误是什么原因详情(文件类型错误请重新选择)

  • win10一段时间不用网络就掉线连不上怎么办两种解(win10一段时间不动黑屏)

    win10一段时间不用网络就掉线连不上怎么办两种解(win10一段时间不动黑屏)

  • 基于Web的疫情防控管理系统(基于web的疫情防控方案)

    基于Web的疫情防控管理系统(基于web的疫情防控方案)

  • 小规模纳税人转一般纳税人
  • 印花税滞纳金应计入什么
  • 普通增值税有什么用
  • 跨月如何开具增值税发票
  • 其他综合收益属于当期损益吗
  • 个税两种申报方式哪种好
  • 利息税减少
  • 年终奖分摊到每个月
  • 货物运费包含哪些项目
  • 土地补偿费入什么科目
  • 销项税额转出减去还是加上
  • 明细分类账采用的格式有
  • 净现值为零时的收益率
  • 员工报销会计分录怎么做
  • 停业之后申请恢复营业申请书范文
  • 库存商品做账
  • 砂石建筑材料验收规范
  • 已抵扣进项税额的购进货物或者应税劳务
  • 固定资产评估增值递延所得税
  • 工业企业税负率一般控制在多少?
  • 不动产60%和40%抵扣时间
  • 印花税的收取
  • 企业的消费税
  • 这些常用的发票知识,你都知道了吗?
  • 公司办公楼的中介怎么做
  • 应交增值税是否影响企业利润
  • 出口退税进口免税
  • mac怎么打开hosts文件
  • 电脑不能上网是什么原因?
  • 苹果11屏幕尺寸长宽
  • 处理废料会计分录大全
  • PHP:mb_ereg_replace_callback()的用法_mbstring函数
  • 一般纳税人购进农产品如何抵扣进项税额
  • 本地连接没有了怎么恢复
  • 固定资产后续支出一律计入固定资产成本
  • 鸟瞰画面
  • 增值税加计扣除最新政策
  • 暂估成本的账务处理分录
  • LangChain与大型语言模型(LLMs)应用基础教程:信息抽取
  • yii2带搜索功能的下拉框实例详解
  • 媒体查询是什么
  • 自然人税收管理系统
  • 劳动仲裁支付的个人款项怎么做账
  • 金蝶k3固定资产如何入账
  • 长期股权投资的账面价值怎么计算
  • 什么情况下计入库存商品
  • ms sql 2012
  • 小规模未达到起征点如何结转
  • 公司收到服务费要交哪些税
  • 收入结转到本年利润的会计分录
  • 报废的固定资产清理的净损失计入营业外支出
  • 应交增值税减免税额在借方
  • 购进生产免税货物用材料可以抵扣进项税额吗
  • 宾馆收入怎么做账
  • 疫情防控重点保障物资生产企业可以按月
  • 企业票据贴现属于什么业务
  • 月末结转销售会计分录
  • 收到第三方补助怎么做账
  • 代开发票预缴税款的比例是多少呢?
  • 应付账款和应付票据的区别与联系
  • 应交税金借方余额在报表列示
  • 企业注销其他应付款怎么处理账务
  • 营改增问题解答
  • 应用《企业会计》的论文
  • 培训费发票是否可以抵扣
  • mysql第五章上机
  • 升级尝鲜
  • mysql数据库里面有一个表查的特别慢
  • Windows7任务计划在什么位置?
  • linux设置时间日期
  • ubuntu 18.04网络连接
  • downloader.exe是什么
  • 小米4刷windows 10
  • java程序员准备骑驴找马了,需要怎么准备
  • jquery获取鼠标位置
  • unity的invoke
  • android教学
  • 消费税抵扣范围包括哪些
  • 外籍人个人所得税汇算清缴流程
  • 环保税申报操作手册
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设