1.使用

安装或更新:

 npm install vux --save

npm install vux-loader --save

如果没有安装less:

npm install less less-loader --save-dev

在build/webpack.base.conf.js里配置

把之前的module.exports部分赋值给一个变量,比如:

let webpackConfig = {
   .......//初始的module.exports部分
}
在文件结尾加上:
module.exports = vuxLoader.merge(webpackConfig,{
plugins:[
{name: 'vux-ui'},
]
})

2.使用

在main.js里面:

import { AlertPlugin } from "vux";

Vue.use(AlertPlugin)

组件里:

methods: {
vuealert(msg) {
this.$vux.alert.show({
content: msg,
buttonText: "好的",
hideOnBlur: true
});
}
},

3.配置全局变量

如果要对全局变量(比如颜色、字体)进行配置,需要增加less文件,新建一个less文件(比如src/style/theme.less),加入标红的配置

module.exports = vuxLoader.merge(webpackConfig,{
plugins:[
{name: 'vux-ui'},
{name: 'less-theme', path: 'src/style/theme.less'}
]
})

能配置的全局变量参考:

https://github.com/airyland/vux/blob/v2/src/styles/variable.less

在theme.less里配置的值将会覆盖上面地址里配置的值

 

  

vux-- Vue.js 移动端 UI 组件库的更多相关文章

  1. 基于Svelte3.x桌面端UI组件库Svelte UI

    Svelte-UI,一套基于svelte.js开发的桌面pc端ui组件库 最近一直忙于写svelte-ui,一套svelte3开发的桌面端ui组件库.在设计及功能上借鉴了element-ui组件库.所 ...

  2. 前端笔记之Vue(四)UI组件库&Vuex&虚拟服务器初识

    一.日历组件 new Date()的月份是从0开始的. 下面表达式是:2018年6月1日 new Date(2018, 5, 1); 下面表达式是:2018年5月1日 new Date(2018, 4 ...

  3. vux 是基于 WeUI 和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面。

    https://doc.vux.li/zh-CN/ https://vux.li/

  4. Weex Ui 是一个基于 Weex 的富交互、轻量级、高性能的移动端 UI 组件库

    Github资源:https://github.com/alibaba/weex-ui 预览 你可以通过飞猪.淘宝.天猫.Weex Playground 或者浏览器扫码体验 安装 npm i weex ...

  5. 总结:iview(基于vue.js的开源ui组件)学习的一些坑

    1.要改变组件的样式 找到这个组件的class名,然后覆盖样式. 举例:修改select框,显示圆角.只需给找到类名并写样 .ivu-select-selection{ border-radius:1 ...

  6. 16款优秀的Vue UI组件库推荐

    16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基 ...

  7. 强烈推荐优秀的Vue UI组件库

    Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基于Vue的UI组件框架开发,并投入正 ...

  8. 【转】优秀的Vue UI组件库

    原文来源:https://www.leixuesong.com/3342 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司 ...

  9. VUE:UI组件库(Mint UI & Elment)

    VUE:UI组件库 常用 1)Mini UI: a 主页:http://mint-ui.github.io/#!/zh-cn b 说明:饿了么开源的基于vue的移动端UI组件库 2)Elment a ...

随机推荐

  1. idea 2019.3 最新版破解教程

    背景 最近,idea又被整治了,所以一大批激活码都失效了.我之前已经有2018版的永久激活了,所以非常淡定~,也没打算升级版本.但是,最近发现周围的人都在讨论这个问题.于是,我也找到了2019.3最新 ...

  2. .Net Core建站(2):EF Core+CodeFirst数据库迁移

    上一篇的话,说了下怎么使用EF7 实现 CodeFirst去生成数据库, 其实还有好多问题的,这次一点一点的解决吧,都挺简单,不过零零散散的,, 1.读取配置文件,获得链接字符串 2.使用数据库进行增 ...

  3. 谈谈模型融合之三 —— GBDT

    前言 本来应该是年后就要写的一篇博客,因为考完试后忙了一段时间课设和实验,然后回家后又在摸鱼,就一直没开动.趁着这段时间只能呆在家里来把这些博客补上.在之前的文章中介绍了 Random Forest ...

  4. Selenium(一):元素定位

    一.Selenium 8种定位方式 baidu.html <form id="form" name="f" action="/s" c ...

  5. tensorflow 案例

    import tensorflow as tf import numpy as np #添加一层inputs输入的数据,in_size为输入节点数,out_size为输出节点数,下一个为激励函数 de ...

  6. Spring注解开发系列Ⅳ --- 属性赋值

    在Spring框架中,属性的注入我们有多种方式,我们可以通过构造方法注入,可以通过set方法注入,也可以通过p名称空间注入,方式多种多样,对于复杂的数据类型比如对象.数组.List集合.map集合.P ...

  7. Oracle数据库安装与卸载

    一.下载俩个压缩包,同时选中解压到一个文件夹中 二.点击step.exe(win10可能弹出不满足环境要求,选择是就行了) 三.把接收更新勾掉不需要 四.选择创建和配置数据库 五.选择服务器类 六.选 ...

  8. Win10系统下如何将中文登录名改为英文登录名

    需求:本人每次在换完系统后是默认,图方便,登录名就直接是自己的名字,造成以后安装个别软件时会莫名其妙的出错. 解决办法: 1.在当前用户开始处-点击右键(Windows键+X)-注销 2.切换到Adm ...

  9. Javascript小白经典题型(二)

    51. 输出的是什么? function getInfo(member, year) { member.name = "Lydia"; year = "1998" ...

  10. 关于RiscV的一些资料整理

    1. 基于RISC-V架构的开源处理器及SoC研究综述 https://mp.weixin.qq.com/s/qSD-q8y0_MY8R0MBA85ZZg 原文链接: https://blog.csd ...