vue 添加vux的代码讲解


Posted in Javascript onNovember 30, 2017

简介

Vux(读音 [v'ju:z],同views)是基于WeUI和Vue(2.x)开发的移动端UI组件库,主要服务于微信页面。

基于webpack+vue-loader+vux可以快速开发移动端页面,配合vux-loader方便你在WeUI的基础上定制需要的样式。

vux-loader保证了组件按需使用,因此不用担心最终打包了整个vux的组件库代码。

vux并不完全依赖于WeUI,但是尽量保持整体UI样式接近WeUI的设计规范。最初目标是创建一个易用,实用,美观的移动端UI组件库,现在离理想状态还有不少距离,因此需要大家及时反馈问题及贡献代码。

1、命令添加vux

npm install vux --save

2、在build/webpack.base.conf.js中配置

const vuxLoader = require('vux-loader')
const webpackConfig = originalConfig // 原来的 module.exports 代码赋值给变量 webpackConfig
//即将原来的module.exports 改为 const webpackConfig
module.exports = vuxLoader.merge(webpackConfig, {
plugins: [{
  name: 'vux-ui'
 }]
})

3、添加less

npm install less less-loader --save-dev

4、添加yaml-loader

npm install yaml-loader --save-dev

5、添加vux-loader

npm install vux-loader --save-dev

6、在main.js中添加

const FastClick = require('fastclick')
FastClick.attach(document.body)
import VueRouter from 'vue-router'
Vue.use(VueRouter)
Javascript 相关文章推荐
javascript函数库-集合框架
Apr 27 Javascript
Javascript下判断是否为闰年的Datetime包
Oct 26 Javascript
jQuery UI Dialog控件中的表单无法正常提交的解决方法
Dec 19 Javascript
js动态设置div的值下例子
Oct 29 Javascript
鼠标选择动态改变网页背景颜色的JS代码
Dec 10 Javascript
js实现无缝滚动特效
Dec 20 Javascript
JS组件Bootstrap Table使用实例分享
May 30 Javascript
js仿京东轮播效果 选项卡套选项卡使用
Jan 12 Javascript
原生js实现轮播图
Feb 27 Javascript
jQuery自定义元素右键点击事件(实现案例)
Apr 28 jQuery
vue 刷新之后 嵌套路由不变 重新渲染页面的方法
Sep 13 Javascript
深入理解Angularjs 脏值检测
Oct 12 Javascript
vue2.x+webpack快速搭建前端项目框架详解
Nov 30 #Javascript
Vue+Vux项目实践完整代码
Nov 30 #Javascript
Bootstrap Table 搜索框和查询功能
Nov 30 #Javascript
微信小程序实现简单input正则表达式验证功能示例
Nov 30 #Javascript
微信小程序实现获取自己所处位置的经纬度坐标功能示例
Nov 30 #Javascript
微信小程序实战篇之购物车的实现代码示例
Nov 30 #Javascript
微信小程序支付及退款流程详解
Nov 30 #Javascript
You might like
php学习 函数 课件
2008/06/15 PHP
浅析PHP文件下载原理
2014/12/25 PHP
PHP7新特性foreach 修改示例介绍
2016/08/26 PHP
php实现的网页版剪刀石头布游戏示例
2016/11/25 PHP
PHP实现上传多文件示例代码
2017/02/20 PHP
微信公众号之主动给用户发送消息功能
2019/06/22 PHP
PHP命名空间用法实例分析
2019/09/04 PHP
php实现记事本案例
2020/10/20 PHP
一些常用的JS功能函数(2009-06-04更新)
2009/06/04 Javascript
jQuery Validation插件remote验证方式的Bug解决
2010/07/01 Javascript
Jquery操作下拉框(DropDownList)实现取值赋值
2013/08/13 Javascript
javascript 函数及作用域总结介绍
2013/11/12 Javascript
jQuery点击其他地方时菜单消失的实现方法
2016/04/22 Javascript
AngularJs IE Compatibility 兼容老版本IE
2016/09/01 Javascript
js调用父框架函数与弹窗调用父页面函数的简单方法
2016/11/01 Javascript
bootstrap 下拉多选框进行多选传值问题代码分析
2017/02/14 Javascript
基于Vue实现图书管理功能
2017/10/17 Javascript
axios 封装上传文件的请求方法
2018/09/26 Javascript
详解nuxt路由鉴权(express模板)
2018/11/21 Javascript
用Vue编写抽象组件的方法
2019/05/06 Javascript
Node.js 在本地生成日志文件的方法
2020/02/07 Javascript
详解ES6实现类的私有变量的几种写法
2021/02/10 Javascript
[31:33]2014 DOTA2国际邀请赛中国区预选赛 TongFu VS DT 第一场
2014/05/23 DOTA
[44:21]Ti4 循环赛第四日 附加赛NEWBEE vs LGD
2014/07/13 DOTA
使用Python对IP进行转换的一些操作技巧小结
2015/11/09 Python
使用Python的Scrapy框架十分钟爬取美女图
2016/12/26 Python
Python基于socket模块实现UDP通信功能示例
2018/04/10 Python
Python写一个基于MD5的文件监听程序
2019/03/11 Python
Python爬虫实现的根据分类爬取豆瓣电影信息功能示例
2019/09/15 Python
python 读取串口数据的示例
2020/11/09 Python
使用Python实现NBA球员数据查询小程序功能
2020/11/09 Python
HTML5中语义化 b 和 i 标签
2008/10/17 HTML / CSS
HTML5计时器小例子
2013/10/15 HTML / CSS
土耳其风格手工珠宝:Ottoman Hands
2019/07/26 全球购物
社区综治宣传月活动总结
2014/07/02 职场文书
Java数组详细介绍及相关工具类
2022/04/14 Java/Android