位置: 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是什么文件)

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

  • 税收优惠退税会计处理
  • 个人境外汇款有限制吗知乎
  • 养老险的基数
  • 原始投资额包括资本化利息吗
  • 旅游的合同
  • 破产清算收到的实收资本是破产资产吗
  • 票面利率大于市场利率是溢价吗
  • 烟草批发环节加征的消费税税率是多少
  • 餐费可以入成本吗
  • 地税退税政策
  • 开增值税票需要合同吗
  • 企业租车费用怎么处理方法
  • 企业所得税营业税金及附加
  • 应收账款的周转率怎么算
  • 如何解决win10关机后usb还在供电
  • 废料收入应如何确定
  • 农民合作社扶持政策
  • vue组件相互引入
  • 支付拍卖成交金额是多少
  • php教程零基础入门
  • rsmsink.exe - rsmsink是什么进程 有何作用
  • 土地使用权进项税如何抵扣
  • 电子钥匙续费应用在哪里
  • 建筑业预缴企业所得税税率
  • 业务招待费应计入期间费用的哪项费用
  • 哪一年底,由linux基金会成立?
  • php的变量
  • PHP:getimagesizefromstring()的用法_GD库图像处理函数
  • 企业所得税弥补以前年度亏损怎么算
  • 租车接送员工上班怎么样
  • php缓存机制有哪些
  • 集群怎么写
  • zend framework手册
  • 多申报缴纳的企业年金
  • Ubuntu server 11.04安装memcache及php使用memcache来存储session的方法
  • jupyter用法
  • c++图像二值化
  • 定额发票在哪查真伪
  • 红票申请单怎么开
  • 3月1日前包括什么意思
  • 报验户如何管理
  • 海关报关单位注销操作规程
  • 管理费用主要包括
  • 天使投资
  • 委托加工物资验收时发生的成本怎么处理
  • 利息收入为负数的原因
  • 租单位的房子怎么办营业执照
  • 社会保险中断后还可以续保吗
  • 企业技术转让会计分录
  • 单位发给职工的餐费补贴我变卖了违法吗?
  • 购买税控盘费用能全额抵扣吗
  • 按照现行会计制度的规定,下列票据中
  • 领备用金时会计怎么做分录
  • 民办非企业的申请流程
  • 同比增长怎么算出来的
  • MySQL ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: NO) 的原因分解决办法
  • myeclipse自动生成get set
  • docker安装使用
  • fedora怎么安装软件
  • 如何快速删除windows.old
  • win10找不到打印机驱动
  • 最近一段时间勒索病毒在全球集中爆发
  • centos6可用yum源
  • win8系统没有无线网络连接
  • windows102021年更新
  • linux dfs
  • javascript的基本语句
  • opengl编程宝典
  • 用vue做项目加入购物车是怎么做到的
  • python中的字符串可变吗
  • 表单验证jquery
  • js弹出框怎么写
  • python 字典怎么添加数据
  • 西安经开税务局电话号码
  • 国家税务总局定额发票查验平台官网
  • 吉林网上报税网址
  • 没有单位怎么交职工养老保险
  • 装卸搬运费属于
  • 车辆购置税是国税吗
  • 重庆地方税务局2016年2号
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

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

    友情链接: 武汉网站建设