在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 相关文章推荐
js静态作用域的功能。
Dec 25 Javascript
jquery 清空file域示例(兼容个浏览器)
Oct 11 Javascript
jquery控制display属性为none或block
Mar 31 Javascript
JS选项卡动态替换banner图片路径的方法
May 11 Javascript
javascript html5 canvas实现可拖动省份的中国地图
Mar 11 Javascript
几种经典排序算法的JS实现方法
Mar 25 Javascript
利用Vue.js实现求职在线之职位查询功能
Jul 03 Javascript
js实现微信/QQ直接跳转到支付宝APP打开口令领红包功能
Jan 09 Javascript
vue使用自定义icon图标的方法
May 14 Javascript
js实现验证码功能
Jul 24 Javascript
Vue scoped及deep使用方法解析
Aug 01 Javascript
vue实现lodop打印功能的示例
Nov 11 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
全国FM电台频率大全 - 28 甘肃省
2020/03/11 无线电
PHP新手上路(三)
2006/10/09 PHP
PHP自带函数给数字或字符串自动补齐位数
2014/07/29 PHP
迁移PHP版本到PHP7
2015/02/06 PHP
PHP 5.6.11中CURL模块问题的解决方法
2016/08/08 PHP
PHP7创建销毁session的实例方法
2020/02/03 PHP
js禁止document element对象选中文本实现代码
2013/03/21 Javascript
鼠标滚轮控制网页横向移动实现思路
2013/03/22 Javascript
jQuery 的全选(全非选)即取得被选中的值使用介绍
2013/11/12 Javascript
EasyUi datagrid 实现表格分页
2015/02/10 Javascript
javaScript中push函数用法实例分析
2015/06/08 Javascript
JS实现控制文本框的内容
2016/07/10 Javascript
jQuery事件绑定方法学习总结(推荐)
2016/11/21 Javascript
利用node.js爬取指定排名网站的JS引用库详解
2017/07/25 Javascript
vue-cli webpack模板项目搭建及打包时路径问题的解决方法
2018/02/26 Javascript
vue2中,根据list的id进入对应的详情页并修改title方法
2018/08/24 Javascript
JS二级菜单不同实现方法分析【4种方法】
2018/12/21 Javascript
在Create React App中启用Sass和Less的方法示例
2019/01/16 Javascript
详细分析Node.js 模块系统
2020/06/28 Javascript
[00:06]Yes,it worked!小卡尔成功穿越时空加入战场!
2019/07/20 DOTA
python使用百度翻译进行中翻英示例
2014/04/14 Python
Python和JavaScript间代码转换的4个工具
2016/02/22 Python
Python安装模块的常见问题及解决方法
2018/02/05 Python
Python基于分析Ajax请求实现抓取今日头条街拍图集功能示例
2018/07/19 Python
Python爬虫框架Scrapy常用命令总结
2018/07/26 Python
python得到单词模式的示例
2018/10/15 Python
pytorch 在网络中添加可训练参数,修改预训练权重文件的方法
2019/08/17 Python
Python requests设置代理的方法步骤
2020/02/23 Python
python可迭代对象去重实例
2020/05/15 Python
html5使用canvas实现图片下载功能的示例代码
2017/08/26 HTML / CSS
html5中使用hotcss.js实现手机端自适配的方法
2020/04/23 HTML / CSS
马来西亚最大的电器网站:Senheng
2017/10/13 全球购物
财务助理岗位职责
2013/11/10 职场文书
领导视察欢迎词
2014/01/15 职场文书
食品安全责任书范本
2015/05/09 职场文书
优胜劣汰,强者为王——读《鲁滨逊漂流记》有感
2019/08/15 职场文书