HbuilderX:uni app踩坑之uView-ui

最近在自学uniapp，想找一个ui框架提高一下学习和开发的效率，于是就网上冲浪，浪来浪去，最后选择了uView-ui这款。其实有些框架我是有基础的，比如bootstrap、element、iView…可能比较喜欢新鲜的东西吧，就一脚踩进了uView。看官方文档感觉挺好用的，然后说干就干，从环境开始。

HbuilderX对uniapp的集成挺好的，有现成的模板可以用：

其中也有uView模板，拿来就用，很方便

但我可能是比较喜欢钻（搞）研（笑）吧，就是想自己配置一下uView，然后就是一系列的崩溃…

我按照官方文档（添加链接描述）的步骤来配置环境，很easy，这里就不贴截图了，官网都有。有了vue基础，简直就是分分钟的事。下面说说遇到的坑吧。

坑一：
我尝试了官方文档的环境配置不知道多少遍，配了又删删了又配，运行之后就是一直报错，一直说缺少什么什么文件，自己又看不懂，百度也找不到解决方案，所以又百度了使用vue-cli脚手架方式创建uniapp项目，再npm安装uView，还是不太行的样子…然后又仔细看了不知道多少遍官方文档的环境安装配置步骤，其实官方文档说的很明白：

我电脑上的版本一直是标准版…无语…蠢哭…官方文档很友好，小伙伴们阅读要仔细了。
将HbuilderX换成开发板后，又配置了一下uView环境，一次成功。呼~

坑二：
这个不算是很大的坑。uView与element差不多，标签的写法以u开头，但是我将环境配置好之后，在敲代码时，与uView有关的标签没有代码提示，敲着很不舒服，于是又百度啊百度啊百度…这类问题百度几乎没有答案，也可能是我搜索关键字不太对。唯一有点希望的解决的方案是：将.vue文件移到项目的根目录下，我知道这样不太合理，但还是试了试能不能解决代码提示问题，果然…骗人的，不行！（也不排除有些小伙伴用这种方式可行）然后我就想啊想啊想啊…怎么办怎么办呢，于是就想，官方给了两种uView配置的方式，我用的是npm安装方式，另一种是下载安装，于是我就…没错，我将uView下载了下来，然后将其复制到项目的根目录下，代码提示问题完美解决。所以小伙伴们可以试试直接下载安装配置uView环境，不用npm安装（这个方式我没试过，感觉应该没问题），这样环境与代码提示就一步到位了。
下面介绍两种下载uView的方式：
方式1：
https://ext.dcloud.net.cn/plugin?id=1593
这是官方给的地址，最好是谷歌浏览器。进去之后，往下拉，依次选择：

项目名称可以默认，也可以自己另外命名。

将目录下的uview-ui目录整个复制到自己的项目的根目录下。

方式2：
在HbuilderX创建项目时，直接选择uView UI模板创建项目

然后在这个模板项目的基础上编写自己的代码。

希望这篇博客能帮到一些小伙伴。每天都犯蠢，每天都快乐，程序猿/媛宝宝们加油！

HbuilderX:uni app踩坑之uView-ui相关推荐

微信小程序uni.getImageInfo踩坑大计划
B站https://www.bilibili.com/read/cv6317437 如果你在使用getImageInfo的时候真机调试没问题,上传生成体验版的时候或者是线上版本没反应,主要原因是网络图 ...
uniapp开发聊天APP踩坑记录
最近工作重心转移到了uniapp上,有一说一,这个框架跨端确实牛逼,一套代码能一次编译到多端使用.但随之而来的兼容性问题也是层出不穷,同样的在面临APP底层的改动也显得力不从心.同时,uniapp的性 ...
mysql key uni_uni app 踩坑实录
1.scroll-view 滚动 /*uni app scroll haker*/ this.scrollTop = Math.random(); this.$nextTick(function() ...
uni-app 开发安卓app踩坑记录
uni-app离线打包android -- 官方文档 Android studio打包apk后弹窗提示"打包时未添加ui模块" 在工程应用目录的build.gradle文件中bui ...
uni-app真坑 uni.scss踩坑记录
希望设计这块的产品进来被骂希望开发这块的程序员进来被骂希望所有偷懒耍滑的程序员进来被骂希望uni-app的负责人进来被骂希望uni-app的老板进来被骂你们脑子都进水了吗??? 每个scss ...
hbuilder版本更新失败_初试vue-cli使用HBuilderx打包app的坑
微信授权登录提示code-2 appid和appsecret应该是移动应用,而非网页应用微信授权登录提示code:-100/自定义基座无法微信登录和分享开发者账号配置的应用签名应该是md5加密后的 ...
uni-app关于uni.setStorageSync和uni.setStorage踩坑
使用uni-app的uni.setStorageSync缓存数据报错: Error: setStorageSync:fail parameter `key`. Expected String with ...
微信开放标签wx-open-launch-app唤醒app踩坑记录,launch:fail问题解决
微信开放标签调试了一天,各方面都正常,但是一直报错launch:fail,百思不得其解,早网上搜答案,辛得指点,原来问题如下如果要唤醒app,必须使用sdk生成的卡片,或者使用微信开发者工具的浏览功 ...
uniapp-打包APP踩坑日记
1. 报这个错误是因为,在定义一个变量要接收一个对象是,不要给这个变量定义为null,要定义为{},可以用(定义为null就是为了方便判断,因为定义空对象默认是true,结果打包时疯狂报错,改为空对象 ...

HbuilderX:uni app踩坑之uView-ui

HbuilderX:uni app踩坑之uView-ui

HbuilderX:uni app踩坑之uView-ui相关推荐

最新文章

热门文章