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 相关文章推荐
给artDialog 5.02 增加ajax get功能详细介绍
Nov 13 Javascript
开发插件的两个方法jquery.fn.extend与jquery.extend
Nov 21 Javascript
JavaScript极简入门教程(一):基础篇
Oct 25 Javascript
jquery实现相册一下滑动两次的方法
Feb 09 Javascript
JS+CSS实现另类带提示效果的竖向导航菜单
Oct 15 Javascript
Angular实现一个简单的多选复选框的弹出框指令实例
Apr 25 Javascript
详解AngularJS 模块化
Jun 14 Javascript
checkbox:click事件触发span元素内容改变的方法
Sep 11 Javascript
Vue.js划分组件的方法
Oct 29 Javascript
vue中的模态对话框组件实现过程
May 01 Javascript
jquery实现有过渡效果的tab切换
Jul 17 jQuery
vue 动态设置img的src地址无效,npm run build 后找不到文件的解决
Jul 26 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
thinkphp3.0 模板中函数的使用
2012/11/13 PHP
html静态页面调用php文件的方法
2014/11/13 PHP
Yii 2.0实现联表查询加搜索分页的方法示例
2017/08/02 PHP
laravel config文件配置全局变量的例子
2019/10/13 PHP
PHP大文件分割分片上传实现代码
2020/12/09 PHP
javascript入门·动态的时钟,显示完整的一些方法,新年倒计时
2007/10/01 Javascript
jQuery EasyUI API 中文文档 可调整尺寸
2011/09/29 Javascript
javascript验证上传文件的类型限制必须为某些格式
2013/11/14 Javascript
简易的投票系统以及js刷票思路和方法
2015/04/07 Javascript
jQuery增加与删除table列的方法
2016/03/01 Javascript
仅9张思维导图帮你轻松学习Javascript 就这么简单
2016/06/01 Javascript
jQuery实现的placeholder效果完整实例
2016/08/02 Javascript
BootstrapValidator不触发校验的实现代码
2016/09/28 Javascript
简单好用的nodejs 爬虫框架分享
2017/03/26 NodeJs
浅谈关于angularJs中使用$.ajax的注意点
2017/08/12 Javascript
vue mint-ui 实现省市区街道4级联动示例(仿淘宝京东收货地址4级联动)
2017/10/16 Javascript
深入浅析javascript函数中with
2018/10/28 Javascript
Vue 处理表单input单行文本框的实例代码
2019/05/09 Javascript
如何在Vue中抽离接口配置文件
2019/10/31 Javascript
angular *Ngif else用法详解
2020/12/15 Javascript
详细解析Python中__init__()方法的高级应用
2015/05/11 Python
Python入门_学会创建并调用函数的方法
2017/05/16 Python
Python 闭包的使用方法
2017/09/07 Python
Python数据结构之哈夫曼树定义与使用方法示例
2018/04/22 Python
Python3+Django get/post请求实现教程详解
2021/02/16 Python
利用python实现后端写网页(flask框架)
2021/02/28 Python
纯CSS3发光分享按钮的实现教程
2014/09/06 HTML / CSS
世界上最受欢迎的钓鱼诱饵:Rapala
2019/05/02 全球购物
冰淇淋店的创业计划书
2014/02/07 职场文书
营销学习心得体会
2014/09/12 职场文书
2014年英语工作总结
2014/12/20 职场文书
工会经费申请报告
2015/05/15 职场文书
忠诚与背叛观后感
2015/06/04 职场文书
2016年校园植树节广播稿
2015/12/17 职场文书
详解解Django 多对多表关系的三种创建方式
2021/08/23 Python
Win11安装受阻怎么办? Windows11安装问题与解决方案汇总
2021/11/21 数码科技