在vue中安装使用vux的教程详解


Posted in Javascript onSeptember 16, 2018

最近因为的工作的原因在弄vue,从后端弄到前端之前一直用js,现在第一次接触vue感觉还挺有意思的,就是自己太菜了,这个脑子呀。。。。不太够用。。。。。页面设计用了一个叫vux的东西,vux可以提供一些组件,用起来还是比较方便的,因为自己比较菜吧,所以有很多东西还是不太深入了解。。。比如对vux自带样式的修改。。希望有大牛看到的话也可以多多指点。。。

今天就记录一下vux的安装使用吧。。。。。。

首先自己要先新建一个vue项目,cmd进入到项目目录下,进行安装

1.在项目目录下安装vux(也可以使用yarn安装,本人没有使用过就不多介绍了,我是用npm安装,网速慢的话可以使用淘宝镜像安装)

npm install vux --save

安装淘宝镜像

npm install --registry=https://registry.npm.taobao.org
npm config get registry    //判断淘宝镜像是否安装成功

使用淘宝镜像安装vux

cnpm install vux --save

2.安装成功后安装vux-loader,如果使用的是vux2的话必须安装vux-loader

npm install vux-loader --save-dev

安装成功后在 build/webpack.base.conf.js 中进行配置

const vuxLoader = require('vux-loader')

在vue中安装使用vux的教程详解

将原来的 module.exports 代码赋值给变量 webpackConfig

在vue中安装使用vux的教程详解

并在build/webpack.base.conf.js中添加如下代码

module.exports = vuxLoader.merge(webpackConfig, {
 plugins: ['vux-ui']
})

在vue中安装使用vux的教程详解

3.安装less-loader以正确编译less源码

npm install less less-loader --save-dev

安装成功后在代码的resolve中添加less 如图:

在vue中安装使用vux的教程详解 

4.安装yaml-loader

npm install yaml-loader --save-dev

5. 重新编译项目后就可以使用vux的组件了

npm run dev

总结

以上所述是小编给大家介绍的在vue中安装使用vux的教程详解,希望对大家有所帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的!

Javascript 相关文章推荐
QUnit jQuery的TDD框架
Nov 04 Javascript
js与jquery中获取当前鼠标的x、y坐标位置的代码
May 23 Javascript
js滚动条回到顶部的代码
Dec 06 Javascript
JS实现的省份级联实例代码
Jun 24 Javascript
js 固定悬浮效果实现思路代码
Aug 02 Javascript
jQuery插件MixItUp实现动画过滤和排序
Apr 12 Javascript
JavaScript实现的Tween算法及缓冲特效实例代码
Nov 03 Javascript
JavaScript html5 canvas绘制时钟效果
Mar 01 Javascript
Angularjs中的事件广播 —全面解析$broadcast,$emit,$on
May 17 Javascript
使用AngularJS 跨站请求如何解决jsonp请求问题
Jan 16 Javascript
bootstrap是什么_动力节点Java学院整理
Jul 14 Javascript
vue总线机制(bus)知识点详解
May 10 Javascript
React 组件中的 bind(this)示例代码
Sep 16 #Javascript
Vue.set()动态的新增与修改数据,触发视图更新的方法
Sep 15 #Javascript
解决VUE中document.body.scrollTop为0的问题
Sep 15 #Javascript
Vue实现调节窗口大小时触发事件动态调节更新组件尺寸的方法
Sep 15 #Javascript
vue 监听某个div垂直滚动条下拉到底部的方法
Sep 15 #Javascript
vue--点击当前增加class,其他删除class的方法
Sep 15 #Javascript
vue-cli 使用vue-bus来全局控制的实例讲解
Sep 15 #Javascript
You might like
一个简单且很好用的php分页类
2013/10/26 PHP
PHP在弹框中获取foreach中遍历的id值并传递给地址栏
2017/06/13 PHP
php实现保存周期为1天的购物车类
2017/07/07 PHP
js中同步与异步处理的方法和区别总结
2013/12/25 Javascript
JavaScript如何禁止Backspace键
2015/12/02 Javascript
Bootstrap选项卡与Masonry插件的完美结合
2016/07/06 Javascript
js简单时间比较的方法
2016/08/02 Javascript
JS识别浏览器类型(电脑浏览器和手机浏览器)
2016/11/18 Javascript
Vue关于数据绑定出错解决办法
2017/05/15 Javascript
浅谈JS如何实现真正的对象常量
2017/06/25 Javascript
javascript ES6 新增了let命令使用介绍
2017/07/07 Javascript
Three.js中网格对象MESH的属性与方法详解
2017/09/27 Javascript
Nodejs调用WebService的示例代码
2017/09/29 NodeJs
关于vue中 $emit的用法详解
2018/04/12 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
2018/05/04 Javascript
详解angular部署到iis出现404解决方案
2018/08/14 Javascript
react native 原生模块桥接的简单说明小结
2019/02/26 Javascript
详解如何运行vue项目
2019/04/15 Javascript
在Vue中使用HOC模式的实现
2020/08/23 Javascript
微信小程序实现点击生成随机验证码
2020/09/09 Javascript
[02:57]DOTA2亚洲邀请赛 SECRET战队出场宣传片
2015/02/07 DOTA
以Python的Pyspider为例剖析搜索引擎的网络爬虫实现方法
2015/03/30 Python
Python基于tkinter模块实现的改名小工具示例
2017/07/27 Python
在python3环境下的Django中使用MySQL数据库的实例
2017/08/29 Python
小米5s微信跳一跳小程序python源码
2018/01/08 Python
Python selenium实现微博自动登录的示例代码
2018/05/16 Python
Python numpy中矩阵的基本用法汇总
2019/02/12 Python
Python实现12306火车票抢票系统
2019/07/04 Python
Pytorch实现LSTM和GRU示例
2020/01/14 Python
python3爬虫中引用Queue的实例讲解
2020/11/24 Python
html5中如何将图片的绝对路径转换成文件对象
2018/01/11 HTML / CSS
蔻驰英国官网:COACH英国
2020/07/19 全球购物
自1926年以来就为冰岛保持温暖:66°North
2020/11/27 全球购物
简历的个人自我评价范文
2014/01/03 职场文书
Nginx安装完成没有生成sbin目录的解决方法
2021/03/31 Servers
Python编写nmap扫描工具
2021/07/21 Python