如何在vue-cli中配置amazeui的vue版本

问题描述：本人刚入门vue,在vue-cli中使用amazeui的vue版本配置时遇到了一些疑惑，特将解决的过程和办法记录下来

amazeui自身依赖jquery,而vue全家桶完全可以替代jquery的各种功能，当我们使用vue框架进行开发时，如果想要使用amazeui，则必须再引入jquery，就显得十分冗余。近期我在开发一个网站的前端，使用vue全家桶，于是我在github上找到了几个非官方团团队开发的vue版的amazeui,分别踩了几个坑。

star数量最多，并且得到官方推荐的是https://github.com/zcoding/amazeui-vue，我自然从这个下手。

以下是几个步骤：

1、 npm install amazeui-vue

2、在vue-cli项目下的package.json文件中，"devDependencies"项中添加 "amazeui-vue": "（具体的版本号)"

3、在项目的根目录下，执行 npm install （将依赖模块的源代码导入到node_modules中）

4、在 /src/main.js中添加如下代码

Vue.use(require('amazeui-vue').install);

即可

5、运行 npm run dev 结果大爆炸，出现了大几十处错误

原因是这个amazeui-vue是基于vue1.0,而目前vue已经升到2.x,所以出现这么多错误也是正常的

第一次踩坑之后，我挑选了star数第二的https://github.com/sunshineJi/amaze-vue，这个是基于vue2.0搭建，过程同上面的类似

1、npm install amaze-vue --save

2、在vue-cli项目下的package.json文件中，"devDependencies"项中添加 "amaze-vue": "（具体的版本号)"

3、在项目的根目录下，执行 npm install （将依赖模块的源代码导入到node_modules中）

4、在 /src/main.js中添加如下代码

import AmazeVue from 'amaze-vue';
import 'amaze-vue/dist/amaze-vue.css';Vue.use(AmazeVue);

5、运行 npm run dev 这次结果就是正确的了，没有报错

之后就可以根据https://sunshineji.github.io/amaze-vue-docs/#/文档使用样式和组件了

最后提醒一句，这个amazeui-vue在移动端的适配不是太好，大部分组件都是针对pc端开发的，没有原生的移动端优势，同时还有一些样式上的小bug,需要在使用时自己添加一些css加以修改。

同时，我也试了试star数第三的https://github.com/zjhr/vue-amazeui，这个项目基本继承了原生的特性，较上面的项目要好很多，但是我添加后报了许多错误，同时原作者也在issue中提醒不要在生产环境中使用，原作者已经不再维护。

如何在vue-cli中配置amazeui的vue版本相关推荐

) php中_如何在webmin中配置多个PHP版本
请关注本头条号,每天坚持更新原创干货技术文章. 如需学习视频,请在微信搜索公众号"智传网优"直接开始自助视频学习 1. 前言如何在webmin中配置多个PHP版本?本教程将会给您 ...
Vue CLI 3 配置兼容IE10
Vue CLI 3 配置兼容IE10 最近做了一个基于Vue的项目,需要兼容IE浏览器,目前实现了打包后可以在IE10以上运行,但是还不支持在运行时兼容IE10及以上.Vue CLI 3 中文文档安 ...
scss 是什么？在 Vue.cli 中的安装使用步骤是？有哪几大特性？（gxcw）
首先什么是scss呢? scss是一种css预处理语言,是一个css的扩展,它在css语法的基础上,允许使用变量,嵌套规则,混合,导入,继承等功能,使得css更加强大和优雅,而且其完全兼容css3. ...
【Enterprise Manager 12c】如何在EM 12c中配置Exadata Infiniband告警邮件
EM 12c集中了Exadata的大量管理功能,这里我们介绍一下如何在EM 12c中配置Exadata Infiniband告警邮件? 首先需要将IB network加入到EM target中,点击E ...
eclipse java luna,java-如何在Eclipse Luna中配置Lombok
java-如何在Eclipse Luna中配置Lombok 我使用Maven在Eclipse Luna中配置了龙目岛. 注释已正确添加,但没有生成getter和setter. eclipse.ini ...
linux7系统怎么启动ftp,教你如何在CentOS7系统中配置ftp服务
本文教你如何在CentOS7系统中配置ftp服务. 1.下载vsftpd yum install -y vsftpd 2.设置开机自启动 systemctl enable vsftpd.service ...
如何在 Windows Server 中配置权威时间服务器
如何在 Windows Server 中配置权威时间服务器查看本文应用于的产品本页 · 简介 o 配置 Windows 时间服务以使用内部硬件时钟 § 帮我修复此问题 § 我 ...
Leaflet笔记-把leaflet-tilelayer-wmts移植到vue cli中（含思路）
目录前言过程前言关于leaflet的webpackage使用npm安装官方是有明显的解析但是关于插件特别是TileLayer.WMTS是不提供的,但提供了源码,可以稍微修改下,就能在vue ...
前端笔记-vue cli中axios批量发送get和post请求及注意事项
目录基本概念关键代码基本概念这里安装好axios后,还要安装qs npm install --save qs 在vue cli中在created里面调用方法,他会在页面加载完成后自动调用! 批 ...
在linux中如何创建磁盘配额,如何在Linux系统中配置磁盘配额？
今天我们看看如何在Linux系统中配置磁盘配额,限制用户滥用空间.使用磁盘配额是相当简单的,对于限制那些过多占用磁盘空间的家伙很有用.而且,你还可以设置软配额和硬配额,软配额可以在某个用户接近其容量空 ...

如何在vue-cli中配置amazeui的vue版本

如何在vue-cli中配置amazeui的vue版本相关推荐

最新文章

热门文章