Vue项目上使用MUI

    MUI是一款轻量级的APPUI样式框架,官网地址:http://dev.dcloud.net.cn/mui/,Github:https://github.com/dcloudio/mui,它跟Bootstrap一样,即拿即用。但是需要注意的是,它在npm下是不支持安装的,所以要想在项目中使用它,我们就需要在Gihub上下载,之后将它的dist文件夹下的文件放在项目的第三方引用包文件夹下:../lib

1、使用

我们先打开MUI的Github:https://github.com/dcloudio/mui

点击clone or download下载.zip格式的包

   MUI包下载解压后:

   

dist(发布项目包)------当我们需要用到MUI时,我们复制此文件夹下的文件,粘贴到项目的第三方依赖包lib中,引入样式进行使用

在examples文件夹下是MUI的使用例子

    当我们需要查看按钮这一个功能时,我们就打开hello-mui下的index.html

  找到按钮,点击进入后,根据样式选择按钮查看。

2、Vue项目中使用

  在Vue项目中使用mui方法非常简单,首先我们需要用mui的dist开发包,其中包含了css文件夹,font文件夹和js文件夹,在\examples\hello-mui下打开index.html,选择我们想要实现的功能复制一份,放到我们需要放到的页面中,在main.js中使用import引用   import './lib/css/mui.css'

 

  • 0
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值