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. lvs+keepalived部署k8s v1.16.4高可用集群

    一.部署环境 1.1 主机列表 主机名 Centos版本 ip docker version flannel version Keepalived version 主机配置 备注 lvs-keepal ...

  2. Heroku学习 - 利用Heroku app实现 OrgA 查询Org B 的数据数据

    最近研究了一番如何通过Heroku应用对OrgA开放一个接口,参数传递的是一个SQL,APP的负责将SQL通过callout的形式调用目标OrgB Rest API来获取数据并返回给OrgA.我是用的 ...

  3. [LOJ#2743][DP]「JOI Open 2016」摩天大楼

    题目传送门 DP 经典题 考虑从小到大把数加入排列内 如下图(\(A\) 已经经过排序): 我们考虑如上,在 \(i\) ( \(A_i\) )不断增大的过程中,维护上面直线 \(y=A_i\) 之下 ...

  4. Dijkstra求解单源最短路径

    Dijkstra(迪杰斯特拉)单源最短路径算法 Dijkstra思想 Dijkstra是一种求单源最短路径的算法. Dijkstra仅仅适用于非负权图,但是时间复杂度十分优秀. Dijkstra算法主 ...

  5. 可视化限流管理,Sentinel 控制台启动和接入

    Sentinel 的使用可以分为核心库和控制台两个部分. 核心库不依赖任何框架/库,集成了主流框架,可以进行单机限流降级等功能, 控制台Dashboard提供了可视化的管理限流规则.对集群进行监控,集 ...

  6. 关于selenium无法在chrome中自动播放flash的问题

    最近用selenium写个小脚本,遇到flash不能自动播放问题 我遇到的情况,直接提示 请确认是否安装flash,其实已经安装,点击下载flash,然后提示是否允许. 整了好久,发现终极方法: ## ...

  7. [ PyQt入门教程 ] PyQt5中多线程模块QThread使用方法

    本文主要讲解使用多线程模块QThread解决PyQt界面程序唉执行耗时操作时,程序卡顿出现的无响应以及界面输出无法实时显示的问题.用户使用工具过程中出现这些问题时会误以为程序出错,从而把程序关闭.这样 ...

  8. Java解析XML文件的方式

    在项目里,我们往往会把一些配置信息放到xml文件里,或者各部门间会通过xml文件来交换业务数据,所以有时候我们会遇到“解析xml文件”的需求.一般来讲,有基于DOM树和SAX的两种解析xml文件的方式 ...

  9. vijos 分梨子

    点击打开题目 很有(wei)趣(suo)的一道题 暴力解法也不难,枚举大小下限与甜度下限,在一个一个地试 显然 O(n^3) 炸掉 但如何将其缩短,只好从那个式子来入手了: C1⋅(ai−a0)+C2 ...

  10. 3分钟接入socket.io使用

    WebSocket 简介 传统的客户端和服务器通信协议是HTTP:客户端发起请求,服务端进行响应,服务端从不主动勾搭客户端. 这种模式有个明显软肋,就是同步状态.而实际应用中有大量需要客户端和服务器实 ...