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. html+css 知识点总结 day1(01-08)

    01  初步认识浏览器 02 浏览器内核 IE   内核:Trident,                 win10 Edge  内核:EdgeHTML Firefox(火狐浏览器)   内核:Ge ...

  2. 新上手jupyterlab安装及问题解决

    最近jupyter notebook又出了一个新玩法:jupyterlab但是很多小伙伴和我一样,在安装的时候出现了很多问题,于是乎我总结了一下,希望给大家带来帮助 首先,最好保持你的浏览器是最新的版 ...

  3. __call__ 方法

    对象() 或 类()() 调用 __call__里面的方法 class Call: def __call__(self, *args, **kwargs): print("Hello __c ...

  4. __new__ 方法

    1.构造方法 实例化过程:构造->初始化 构成方法必须要有返回值,返回给初始化方法的self class A: def __init__(self): self.x = 1 print('ini ...

  5. BZOJ 2648 世界树

    题目传送门 分析: 喜 闻 乐 见 的虚树 但是建好虚树后的DP也非常的恶心 我们先考虑每个关键点的归哪个点管 先DFS一次计算儿子节点归属父亲 再DFS一次计算父亲节点归属儿子 然后然后我们对于虚树 ...

  6. excle 写入数据库

    龙龙博客:https://www.cnblogs.com/meilong/p/cao-zuoexcel-mo-kuaiopenpyxl.html 1 安装 pip install openpyxl 如 ...

  7. 设计模式-03工厂方法模式(Factory Method Pattern)

    插曲.简单工厂模式(Simple Factory Pattern) 介绍工厂方法模式之前,先来做一个铺垫,了解一下简单工厂模式,它不属于 GoF 的 23 种经典设计模式,它的缺点是增加新产品时会违背 ...

  8. Linux 常用工具iptables

    iptables简介 netfilter/iptables(简称为iptables)组成Linux平台下的包过滤防火墙,与大多数的Linux软件一样,这个包过滤防火墙是免费的,它可以代替昂贵的商业防火 ...

  9. springIOC源码接口分析(十一):ConfigurableApplicationContext

    一 实现接口 关系图: ConfigurableApplicationContext接口实现了三个接口,ApplicationContext, Lifecycle, Closeable, Applic ...

  10. CAD制图系列之如何画内切圆

    今天我将记录我们如何画一个大圆,里面均匀内切四个小圆 具体步骤如下: 第一步:首先,先画一个十字架,用于作为轴 第二步:以十字架交点为圆心,画一个半径为25的圆 第三步:以中点为坐标画四十五度斜线,方 ...