HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

现在uni-app感觉很沉寂啊,很不活跃

uniapp

uni-app现在用的人还多吗?感觉没什么人用了啊

uni-app现在用的人还多吗?感觉没什么人用了啊

uniAPP定制开发、uniapp团队开发

uniapp模板 uniapp

定制的APP
  APP开发定制是根据客户需求来进行开发,打造一款全新的APP软件,下面具体说说比较重要的几点。
  1、APP功能定位
  想要定制一款app首先一点要知道自己需要哪些功能,然后就是定位(人群、领域)要确认,把这两个部分确立好以后就围绕自己的需求来开展APP的开发。这也是定制开发APP的第一步,只有在明确了自己的需求以后才可以开发出一款自己想要的APP。
  2、细化功能需求
  一定要清楚明白的将自己的功能需求表达清楚,尽量细化功能。说的越清楚制作的就越全面,app的开发也就越精细。不过我们钰威软件的团队会提供专业的产品经理和策划人员来帮助客户对功能需求进行完善。前期功能细化说的越清楚对后续APP开发也会越顺利。
  3、开发团队的选择
  定制一款APP当然需要找到一家可靠技术过硬的软件开发公司,例如钰威软件。如何判断一个团队是否有足够的能力来开发完善一款APP,需要通过app开发的安全性、APP开发周期、APP开发交付、APP开发后的售后服务等几个方面来考虑。一个正规且完善的开发团队会具备产品经理、策划、工程师、项目经理、iOS程序员、Android程序员、后端程序员和测试等人员。团队技术过硬,人才储备完善都是对APP开发的保障。当然还有一点,无论是前期的APP开发还是后期的APP维护都是很重要的内容。
158-3211-5099

继续阅读 »

定制的APP
  APP开发定制是根据客户需求来进行开发,打造一款全新的APP软件,下面具体说说比较重要的几点。
  1、APP功能定位
  想要定制一款app首先一点要知道自己需要哪些功能,然后就是定位(人群、领域)要确认,把这两个部分确立好以后就围绕自己的需求来开展APP的开发。这也是定制开发APP的第一步,只有在明确了自己的需求以后才可以开发出一款自己想要的APP。
  2、细化功能需求
  一定要清楚明白的将自己的功能需求表达清楚,尽量细化功能。说的越清楚制作的就越全面,app的开发也就越精细。不过我们钰威软件的团队会提供专业的产品经理和策划人员来帮助客户对功能需求进行完善。前期功能细化说的越清楚对后续APP开发也会越顺利。
  3、开发团队的选择
  定制一款APP当然需要找到一家可靠技术过硬的软件开发公司,例如钰威软件。如何判断一个团队是否有足够的能力来开发完善一款APP,需要通过app开发的安全性、APP开发周期、APP开发交付、APP开发后的售后服务等几个方面来考虑。一个正规且完善的开发团队会具备产品经理、策划、工程师、项目经理、iOS程序员、Android程序员、后端程序员和测试等人员。团队技术过硬,人才储备完善都是对APP开发的保障。当然还有一点,无论是前期的APP开发还是后期的APP维护都是很重要的内容。
158-3211-5099

收起阅读 »

【不看手册硬刚踩坑系列1】微信模拟器白屏事件

*写的啰嗦,着急的朋友直接看最后一行问题解决办法就行

序言

一直是5+的簇拥,三天打鱼两天晒网的摆弄着移动端开发。从uniapp诞生之日就一直关注,但考虑到新框架“坑”会很多,再结合5+时期官方的反应速度,一直处于观望态度。
最近有个微信开发小项目,想起uniapp官方各种横向对比中牛逼的一塌糊涂,就更新了hbuilderX,和微信开发者工具。提刀上阵。
不喜欢看手册,本着有坑采坑没坑记录的心态,出个系列,给自己也给“后浪”一个参考和话题。

正文

本着硬刚的心态,开起hbuilderX,新建项目,找个官方项目hello uniapp,按下新建按钮,建立了第一个uniapp项目。点开运行菜单,比起5+时代有牌面了很多!什么微信,百度,头条,支付宝都给了模拟器。本鸟是要做微信项目,自然点微信,自然也是直接进坑。

1,安全端口
点开微信开发者工具运行后,直接卡住,得益于HbuilderX的人性化提示,得知,要想调用微信开发者工具,要安全端口。按说明,打勾,check!过了~

2,白屏
顺利启动开发者工具,正自鸣得意,直接入坑。白屏,妥妥的loading。可能我这2019老mbp不行了?等等看,刷了n多网页回来看,还是loading。。。,慌了,这尼玛是什么情况,看提示,【检查是否启动多个微信开发者工具,如果是则关闭所有打开的微信开发者工具,然后再重新运行】,启动了多个?看了下微信开发者工具,没有多个!
按照5+时代的尿性,那第一时间是回娘家登录账号,进社区搜索,白屏,一片关键字检索结果,没有我能用的。。。。。。。

  • 祭出百度搜索大发,竟然无从下手,无果。
  • 祭出5+app开发绝技!关hbuilder,关开发者工具,重新运行,依然无果!
  • 祭出乱试三板斧,重开个colorUI,按下运行->微信开发者工具,喵的一声,好用了!

见了鬼了,再试hello uninapp 不好用!依然不好用,继续百度,发现行踪,开发者工具论坛有人反映,项目名中文的就会白屏,一看现象一样,赶紧看我的manifest是不是中文,hello uni-app整整齐齐的摆在那,没有中文。。。。。不甘心啊,看看colorUI的项目名,colorUI,没毛病都是英文!

灵光突然一闪,hello uni-app? 这个空格是什么鬼??改成hello_uni-app,运行->微信开发者工具,夸嚓!好用,轻松跑起来。

总结:遇到白屏不要慌,知道掉坑里,就赶紧想办法,不抛弃不放弃,总会出坑。

【微信开发者工具白屏解决办法】检查项目名是否中文或含有空格!

继续阅读 »

*写的啰嗦,着急的朋友直接看最后一行问题解决办法就行

序言

一直是5+的簇拥,三天打鱼两天晒网的摆弄着移动端开发。从uniapp诞生之日就一直关注,但考虑到新框架“坑”会很多,再结合5+时期官方的反应速度,一直处于观望态度。
最近有个微信开发小项目,想起uniapp官方各种横向对比中牛逼的一塌糊涂,就更新了hbuilderX,和微信开发者工具。提刀上阵。
不喜欢看手册,本着有坑采坑没坑记录的心态,出个系列,给自己也给“后浪”一个参考和话题。

正文

本着硬刚的心态,开起hbuilderX,新建项目,找个官方项目hello uniapp,按下新建按钮,建立了第一个uniapp项目。点开运行菜单,比起5+时代有牌面了很多!什么微信,百度,头条,支付宝都给了模拟器。本鸟是要做微信项目,自然点微信,自然也是直接进坑。

1,安全端口
点开微信开发者工具运行后,直接卡住,得益于HbuilderX的人性化提示,得知,要想调用微信开发者工具,要安全端口。按说明,打勾,check!过了~

2,白屏
顺利启动开发者工具,正自鸣得意,直接入坑。白屏,妥妥的loading。可能我这2019老mbp不行了?等等看,刷了n多网页回来看,还是loading。。。,慌了,这尼玛是什么情况,看提示,【检查是否启动多个微信开发者工具,如果是则关闭所有打开的微信开发者工具,然后再重新运行】,启动了多个?看了下微信开发者工具,没有多个!
按照5+时代的尿性,那第一时间是回娘家登录账号,进社区搜索,白屏,一片关键字检索结果,没有我能用的。。。。。。。

  • 祭出百度搜索大发,竟然无从下手,无果。
  • 祭出5+app开发绝技!关hbuilder,关开发者工具,重新运行,依然无果!
  • 祭出乱试三板斧,重开个colorUI,按下运行->微信开发者工具,喵的一声,好用了!

见了鬼了,再试hello uninapp 不好用!依然不好用,继续百度,发现行踪,开发者工具论坛有人反映,项目名中文的就会白屏,一看现象一样,赶紧看我的manifest是不是中文,hello uni-app整整齐齐的摆在那,没有中文。。。。。不甘心啊,看看colorUI的项目名,colorUI,没毛病都是英文!

灵光突然一闪,hello uni-app? 这个空格是什么鬼??改成hello_uni-app,运行->微信开发者工具,夸嚓!好用,轻松跑起来。

总结:遇到白屏不要慌,知道掉坑里,就赶紧想办法,不抛弃不放弃,总会出坑。

【微信开发者工具白屏解决办法】检查项目名是否中文或含有空格!

收起阅读 »

运行到真机失败 报Module build failed怎么解决

[HBuilder] 20:25:37.837 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js):
[HBuilder] 20:25:37.837 TypeError: Cannot read property 'value' of undefined
[HBuilder] 20:25:37.842 at genVModel (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\uni-template-compiler\lib\app\service.js:186:78)
[HBuilder] 20:25:37.842 at Array.genData (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\uni-template-compiler\lib\app\service.js:196:3)
[HBuilder] 20:25:37.848 at genData$3 (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4167:32)
[HBuilder] 20:25:37.849 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4011:16)
[HBuilder] 20:25:37.855 at genNode (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4423:12)
[HBuilder] 20:25:37.856 at G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4386:55
[HBuilder] 20:25:37.861 at Array.map (<anonymous>)
[HBuilder] 20:25:37.861 at genChildren (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4386:29)
[HBuilder] 20:25:37.866 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4014:49)
[HBuilder] 20:25:37.867 at genFor (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4134:42)
[HBuilder] 20:25:37.872 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:3996:12)
[HBuilder] 20:25:37.873 at genChildren (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4380:50)
[HBuilder] 20:25:37.879 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4014:49)
[HBuilder] 20:25:37.880 at genNode (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4423:12)
[HBuilder] 20:25:37.885 at G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4386:55
[HBuilder] 20:25:37.885 at Array.map (<anonymous>)
[HBuilder] 20:25:37.891 ERROR Build failed with errors.

继续阅读 »

[HBuilder] 20:25:37.837 Module build failed (from ./node_modules/@dcloudio/vue-cli-plugin-uni/packages/vue-loader/lib/loaders/templateLoader.js):
[HBuilder] 20:25:37.837 TypeError: Cannot read property 'value' of undefined
[HBuilder] 20:25:37.842 at genVModel (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\uni-template-compiler\lib\app\service.js:186:78)
[HBuilder] 20:25:37.842 at Array.genData (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\uni-template-compiler\lib\app\service.js:196:3)
[HBuilder] 20:25:37.848 at genData$3 (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4167:32)
[HBuilder] 20:25:37.849 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4011:16)
[HBuilder] 20:25:37.855 at genNode (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4423:12)
[HBuilder] 20:25:37.856 at G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4386:55
[HBuilder] 20:25:37.861 at Array.map (<anonymous>)
[HBuilder] 20:25:37.861 at genChildren (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4386:29)
[HBuilder] 20:25:37.866 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4014:49)
[HBuilder] 20:25:37.867 at genFor (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4134:42)
[HBuilder] 20:25:37.872 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:3996:12)
[HBuilder] 20:25:37.873 at genChildren (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4380:50)
[HBuilder] 20:25:37.879 at genElement (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4014:49)
[HBuilder] 20:25:37.880 at genNode (G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4423:12)
[HBuilder] 20:25:37.885 at G:\测试4\fenrunduo_uni\node_modules\@dcloudio\vue-cli-plugin-uni\packages\vue-template-compiler\build.js:4386:55
[HBuilder] 20:25:37.885 at Array.map (<anonymous>)
[HBuilder] 20:25:37.891 ERROR Build failed with errors.

收起阅读 »

pc端H5和微信内置浏览器的都可以用的一个小demo

应朋友要求,给他写了一个小项目。大家分享一下。

她的需求是可以在pc端和微信内浏览器都可以登录。然后可以在线进行劳动风险评测这么一个软件,在线收费。管理员可以查看统计。还需要在线下载。
因微信内不让下载,所以也没什么特别的好办法,只能跳转。不知道哪个大神能给个解决方案。在android和ios都已经测试了。

不足地方,欢迎大家留言批评指正。
你可以用手机微信扫码二维码测试,

登录二维码

pc端登录 入口pc端点击登录

继续阅读 »

应朋友要求,给他写了一个小项目。大家分享一下。

她的需求是可以在pc端和微信内浏览器都可以登录。然后可以在线进行劳动风险评测这么一个软件,在线收费。管理员可以查看统计。还需要在线下载。
因微信内不让下载,所以也没什么特别的好办法,只能跳转。不知道哪个大神能给个解决方案。在android和ios都已经测试了。

不足地方,欢迎大家留言批评指正。
你可以用手机微信扫码二维码测试,

登录二维码

pc端登录 入口pc端点击登录

收起阅读 »

uni.css样式详解

uniapp

类使用说明
1.uni-padding-wrap:宽度690rpx 左右内边距30rpx ,相当于690/750=92%的宽度。可用于外层包裹

2.单页头,标题和正文
uni-page-head:
uni-page-head-title:
uni-page-body:超出范围隐藏
这三个类的效果

  1. uni-word:上下内边距200rpx 左右100rpx。

过长效果,用在什么地方呢?。

4.uni-title:30rpx行高1.5
uni-title text:24rpx 灰色
可用作正负标题<view class="uni-title">uni-title<text>uni-title text</text></view>

  1. uni-text-gray 灰色#ccc;
  2. uni-text-small 24rpx号字

7.uni-common-mb,uni-common-pb,uni-common-pl,uni-common-mt
上面的common代表通用,后面的第一个字母m代表margin,p代表padding。b代表底部,l代表left,t代表top 他们的距离都是30rpx
.uni-common-mb{
margin-bottom:30rpx;
}
表示uni通用底部外边距30rpx;

8.背景色三个
uni-bg-red,uni-bg-green,uni-bg-blue

9h1-h6效果图

  1. uni-bold 加粗

  2. uni-ellipsis 文本溢出
    不自动换行,文本溢出时显示省略号。

12.uni-btn-v
/ 竖向百分百按钮 /
.uni-btn-v{
padding:10rpx 0;
}
.uni-btn-v button{margin:20rpx 0;}
没明白作者什么意思。

13.表单(from)
uni-form-item 宽度100% 弹性布局,上下内间距10rpx 左右0

附加带有预览效果图。后面的类还没看完。看完再传一遍。

继续阅读 »

类使用说明
1.uni-padding-wrap:宽度690rpx 左右内边距30rpx ,相当于690/750=92%的宽度。可用于外层包裹

2.单页头,标题和正文
uni-page-head:
uni-page-head-title:
uni-page-body:超出范围隐藏
这三个类的效果

  1. uni-word:上下内边距200rpx 左右100rpx。

过长效果,用在什么地方呢?。

4.uni-title:30rpx行高1.5
uni-title text:24rpx 灰色
可用作正负标题<view class="uni-title">uni-title<text>uni-title text</text></view>

  1. uni-text-gray 灰色#ccc;
  2. uni-text-small 24rpx号字

7.uni-common-mb,uni-common-pb,uni-common-pl,uni-common-mt
上面的common代表通用,后面的第一个字母m代表margin,p代表padding。b代表底部,l代表left,t代表top 他们的距离都是30rpx
.uni-common-mb{
margin-bottom:30rpx;
}
表示uni通用底部外边距30rpx;

8.背景色三个
uni-bg-red,uni-bg-green,uni-bg-blue

9h1-h6效果图

  1. uni-bold 加粗

  2. uni-ellipsis 文本溢出
    不自动换行,文本溢出时显示省略号。

12.uni-btn-v
/ 竖向百分百按钮 /
.uni-btn-v{
padding:10rpx 0;
}
.uni-btn-v button{margin:20rpx 0;}
没明白作者什么意思。

13.表单(from)
uni-form-item 宽度100% 弹性布局,上下内间距10rpx 左右0

附加带有预览效果图。后面的类还没看完。看完再传一遍。

收起阅读 »

希望文件搜索和编辑器内容搜索分开。

如题:希望文件搜索和编辑器内容搜索分开。
1)希望在项目管理器中增加搜索框,用来搜索文件。
2)在编辑器窗口新增搜索框,专门搜索编辑器代码内容和替换。

如题:希望文件搜索和编辑器内容搜索分开。
1)希望在项目管理器中增加搜索框,用来搜索文件。
2)在编辑器窗口新增搜索框,专门搜索编辑器代码内容和替换。

uni-app-tempalte 我自己做了一个项目的快速开发模版

技术分享 uniapp插件 uniapp uniCloud

uni-app-templated

项目地址

当时做这个的目的是为了解决如下问题:

  • 1.云函数分散过后冷启动和热启动效率上的巨大差别
  • 2.云函数环境变量的支持,大多数项目都会用到环境变量的配置
    • 由于web的启动是xhbuilder控制的,导致我无法把环境变量植入,需要xhbuilder团队支持。
  • 3.云函数的打包压缩上传
  • 4.本地云函数开发依赖关系,代码检测,如果又需要自己可以集成eslint做代码规范
    • 这块在webpack.config.js中自己可以去配置
  • 4.web开发的时候本地数据mock的支持
    • 这一块写的比较搓,web端由于没有环境变量,我这边数据mock切换需要手动,在App.vue把ajaxMock/ajax 2个方法之间手动切换
  • 5.统一封装的ajax方法,做到格式统一。
  • 6.在web端App.vue直接封装ajax请求,做到页面只要调用处理正确的分之,异常等都统一捕获。

我也不知道接口这块设计的对不对,下面是我的思路。

  • 由于入口函数只有一个函数,所有在函数里面要根据传入的变量去执行不通的方法。
  • 拆解了原来它云公共函数的功能,我觉得打包云公共函数优点xx,而且你云函数打包的时候还是依赖于你本地的云共函数,只不过云公共函数发布可以同步已经依赖的云函数,我觉得有点没用。
  • 我目前构造的是如下

    uniCloud  
    .callFunction({  
        name: name,  
        data: {  
            type: type,  
            form: data  
        }  
    })  
    
    将原来传入的data放置到data的内容,form字段中,然后type 表示实际调用的方法,具体可以查阅App.vue,然后把返回结果统一的封装处理了下  
    
    // 这块我还没想好要怎么去实现,目前就简易贴下这个。  
    async function main(event) {  
        let env = process.env.NODE_ENV  
        if (!event.type) {  
            return ajaxReturn('', -1, '参数传入不正确');  
        }  
    
        if (!dome[event.type]) {  
            return ajaxReturn('', -1, '未找到云方法');  
        }  
        return await dome[event.type](event)  
    }  
    
    // 固定返回的main,这边无需修改,云函数入口只有唯一的一个。  
    export {  
        main  
    }

具体功能开发参考文档地址

uniapp官网

项目目录说明

cloudfunctions-dev

main.js入口函数

config

conf.dev.js 开发环境变量配置

conf.prod.js 打包环境变量配置

mock

index.js 数据mock配置文件 具体实现可以参考mocker-api

pages 常规开发页面

static 常规静态资源目录

.babelrc babel7 废弃。

main.js ,manifest.json,uni.scss,pages.json 常规开发页面

package.json 依赖配置

template.h5.html 打包h5的时候用到的页面模版

template.unicloud.html 调试开发模式云函数报错页面,需要在控制台查看(这块到时候完善在页面直接可以查看)

项目功能说明(使用命令)

npm run dev

  • 项目启动云函数本地调试模式,因为无法连接DB,所以这块一般用来做代码调试,依赖关系检测,配合eslint可以做到代码规范检测,变量使用情况,等。
  • 运行命令后,web端同时开启数据mock模式, web里面开发直接可以请求到mock接口,如果不需要mock,App.vue对调下ajax/ajaxMock

npm run build

  • 云函数打包,目前在config.js就配置了1个index,如果需要支持多文件的话,手动配置
    entry: {  
        index: ['./cloudfunctions-dev/main.js']  
        xxxx: ['./cloudfunctions-dev/xxxx.js']  
    },
  • 打包是product模式,代码回进行压缩,这块遵循webpack打包策略

项目版本管理

v1.0.1

  • 搭建初始化版本
  • 待做内容
    • 1.云函数DB的数据模拟,把数据mock这块跟db的数据返回关联起来,模拟db后可以本地调用接口
    • 2.公共方法的拓展,吧一些token的调用,加解密等公共方法封装起来。
待做内容 预计版本 预计完成版本/时间
云函数DB的数据模拟 v1.0.2 v1.0.3
云函数的本地调用 v1.0.2 v1.0.4
小程序服务端api封装 v1.0.2 v1.0.2
继续阅读 »

uni-app-templated

项目地址

当时做这个的目的是为了解决如下问题:

  • 1.云函数分散过后冷启动和热启动效率上的巨大差别
  • 2.云函数环境变量的支持,大多数项目都会用到环境变量的配置
    • 由于web的启动是xhbuilder控制的,导致我无法把环境变量植入,需要xhbuilder团队支持。
  • 3.云函数的打包压缩上传
  • 4.本地云函数开发依赖关系,代码检测,如果又需要自己可以集成eslint做代码规范
    • 这块在webpack.config.js中自己可以去配置
  • 4.web开发的时候本地数据mock的支持
    • 这一块写的比较搓,web端由于没有环境变量,我这边数据mock切换需要手动,在App.vue把ajaxMock/ajax 2个方法之间手动切换
  • 5.统一封装的ajax方法,做到格式统一。
  • 6.在web端App.vue直接封装ajax请求,做到页面只要调用处理正确的分之,异常等都统一捕获。

我也不知道接口这块设计的对不对,下面是我的思路。

  • 由于入口函数只有一个函数,所有在函数里面要根据传入的变量去执行不通的方法。
  • 拆解了原来它云公共函数的功能,我觉得打包云公共函数优点xx,而且你云函数打包的时候还是依赖于你本地的云共函数,只不过云公共函数发布可以同步已经依赖的云函数,我觉得有点没用。
  • 我目前构造的是如下

    uniCloud  
    .callFunction({  
        name: name,  
        data: {  
            type: type,  
            form: data  
        }  
    })  
    
    将原来传入的data放置到data的内容,form字段中,然后type 表示实际调用的方法,具体可以查阅App.vue,然后把返回结果统一的封装处理了下  
    
    // 这块我还没想好要怎么去实现,目前就简易贴下这个。  
    async function main(event) {  
        let env = process.env.NODE_ENV  
        if (!event.type) {  
            return ajaxReturn('', -1, '参数传入不正确');  
        }  
    
        if (!dome[event.type]) {  
            return ajaxReturn('', -1, '未找到云方法');  
        }  
        return await dome[event.type](event)  
    }  
    
    // 固定返回的main,这边无需修改,云函数入口只有唯一的一个。  
    export {  
        main  
    }

具体功能开发参考文档地址

uniapp官网

项目目录说明

cloudfunctions-dev

main.js入口函数

config

conf.dev.js 开发环境变量配置

conf.prod.js 打包环境变量配置

mock

index.js 数据mock配置文件 具体实现可以参考mocker-api

pages 常规开发页面

static 常规静态资源目录

.babelrc babel7 废弃。

main.js ,manifest.json,uni.scss,pages.json 常规开发页面

package.json 依赖配置

template.h5.html 打包h5的时候用到的页面模版

template.unicloud.html 调试开发模式云函数报错页面,需要在控制台查看(这块到时候完善在页面直接可以查看)

项目功能说明(使用命令)

npm run dev

  • 项目启动云函数本地调试模式,因为无法连接DB,所以这块一般用来做代码调试,依赖关系检测,配合eslint可以做到代码规范检测,变量使用情况,等。
  • 运行命令后,web端同时开启数据mock模式, web里面开发直接可以请求到mock接口,如果不需要mock,App.vue对调下ajax/ajaxMock

npm run build

  • 云函数打包,目前在config.js就配置了1个index,如果需要支持多文件的话,手动配置
    entry: {  
        index: ['./cloudfunctions-dev/main.js']  
        xxxx: ['./cloudfunctions-dev/xxxx.js']  
    },
  • 打包是product模式,代码回进行压缩,这块遵循webpack打包策略

项目版本管理

v1.0.1

  • 搭建初始化版本
  • 待做内容
    • 1.云函数DB的数据模拟,把数据mock这块跟db的数据返回关联起来,模拟db后可以本地调用接口
    • 2.公共方法的拓展,吧一些token的调用,加解密等公共方法封装起来。
待做内容 预计版本 预计完成版本/时间
云函数DB的数据模拟 v1.0.2 v1.0.3
云函数的本地调用 v1.0.2 v1.0.4
小程序服务端api封装 v1.0.2 v1.0.2
收起阅读 »

通过vue-cli3.0创建uni-app项目中使用sass的css预编译的,node-sass一直安装不下来的问题

uni-app项目提供了两种方式创建工程,一种是HBuilderX创建工程,另一种是通过vue-cli脚手架的方式创建uni-app工程项目(相关链接:https://uniapp.dcloud.io/quickstart)。

使用vue-cli脚手架创建uni-app项目,在项目中使用sass预编译时,会安装不下的问题

如一直安装不下,是因为vue-cli3.0默认使用yarn包管理工具而不是原来的npm,yarn中node-sass,需要翻墙的。如果你不翻墙,默认下载极大可能会失的哦!

先执行:

1、npm uninstall node-sass(前提是第一安装失败后,如果没有执行这个,就免了)作用:

后执行:

1、npm install -g cnpm --registry=https://registry.npm.taobao.org (安装淘宝镜像)

2、cnpm install node-sass --save 或者 cnpm install node-sass

继续阅读 »

uni-app项目提供了两种方式创建工程,一种是HBuilderX创建工程,另一种是通过vue-cli脚手架的方式创建uni-app工程项目(相关链接:https://uniapp.dcloud.io/quickstart)。

使用vue-cli脚手架创建uni-app项目,在项目中使用sass预编译时,会安装不下的问题

如一直安装不下,是因为vue-cli3.0默认使用yarn包管理工具而不是原来的npm,yarn中node-sass,需要翻墙的。如果你不翻墙,默认下载极大可能会失的哦!

先执行:

1、npm uninstall node-sass(前提是第一安装失败后,如果没有执行这个,就免了)作用:

后执行:

1、npm install -g cnpm --registry=https://registry.npm.taobao.org (安装淘宝镜像)

2、cnpm install node-sass --save 或者 cnpm install node-sass

收起阅读 »

mac连接不上iphone不是线的问题 解决办法

打开MAC终端,输入下面的命令:

sudo killall -STOP -c usbd

打开MAC终端,输入下面的命令:

sudo killall -STOP -c usbd

Mac下载最新版HbuildX 内置浏览器无法审查元素, 空白的

[内容]

重现步骤

[步骤] Mac下载最新版HbuildX 内置浏览器无法审查元素, 空白的
图片和日志在附件

IDE运行环境说明

[IDE版本号] 2.6.16.20200424

[windows版本号]

[mac版本号] 10.15.4

继续阅读 »

[内容]

重现步骤

[步骤] Mac下载最新版HbuildX 内置浏览器无法审查元素, 空白的
图片和日志在附件

IDE运行环境说明

[IDE版本号] 2.6.16.20200424

[windows版本号]

[mac版本号] 10.15.4

收起阅读 »