HBuilderX

HBuilderX

极客开发工具
uni-app

uni-app

开发一次,多端覆盖
uniCloud

uniCloud

云开发平台
HTML5+

HTML5+

增强HTML5的功能体验
MUI

MUI

上万Star的前端框架

调研分享 -- 基于H5+SDK的跨平台集成方案

分享 技术分享

这是我做的关于公司内部方案的分享,主要讲解了

H5+历史发展和实现原理。

基于JsBridge跨平台开发的演进和Uni-app框架体系介绍。

从0集成到安卓原生工程的实践。

欢迎拍砖,点赞。

这是我做的关于公司内部方案的分享,主要讲解了

H5+历史发展和实现原理。

基于JsBridge跨平台开发的演进和Uni-app框架体系介绍。

从0集成到安卓原生工程的实践。

欢迎拍砖,点赞。

一个签到、兑换、收集的组件,求赞赏。

h5 小程序 mpvue uni_app

是uni-app通用组件,支持mpvue、小程序、原生、H5等

是uni-app通用组件,支持mpvue、小程序、原生、H5等

个推Node.js 微服务实践:基于容器的一站式命令行工具链

node.js

作者:个推Node.js 开发工程师 之诺

背景与摘要

由于工程数量的快速增长,个推在实践基于 Node.js 的微服务开发的过程中,遇到了如下问题:

  1. 每次新建项目都需要安装一次依赖,这些依赖之间基本相似却又有微妙的区别;

  2. 每次新建项目都要配置一遍相似的配置(比如 tsconfig、lint 规则等);

  3. 本地 Mac 环境与线上 Docker 内的 Linux 环境不一致(尤其是有 C++ 依赖的情况)。

为了解决上述问题,个推内部开发了一个命令行小工具来标准化项目初始化流程、简化配置甚至是零配置,提供基于 Docker 的一致构建、运行环境。

CLI: init, build, test & pack

新建一个 Node.js 项目的时候,我们一般会:

  1. 安装许多开发依赖:TypeScript、Jest、TSLint、benchmark、typedoc 等;

  2. 配置 tsconfig、lint 规则、.prettierrc 等;

  3. 安装众多项目依赖:koa、lodash、sequelize、ioredis、zipkin、node-fetch 等;

  4. 初始化目录结构;

  5. 配置CI 脚本。

通常,我们会选择复制一个现成的项目进行修改,导致出现众多看似相似却又不完全相同的项目,比如十个项目可能会对应十种配置组合。对于同时跨多个工程的开发人员来说,众多配置组合会增加他们的工作难度。而且,当安全审计发现某些 npm package 出现安全隐患时,开发人员则需要对每个引用这些包的项目逐一检查和修正。

在确定的开发场景下,几乎所有项目的开发依赖都差不多,开发配置也非常相似,因此我们基于 commander.js 写了一个 init 工具,它会开个命令行的向导,自动安装依赖、初始化项目目录结构和配置。从而创建项目,并按照场景将所有配置收缩为特定几种模板,进行统一处理。

随后,我们有了 build、test、pack 命令,托管了 tsconfig、jest 配置、打包配置,自动调用 tsc 编译,构建测试环境,然后调用 Jest 进行测试,进行标准化打包, CI 脚本基本可以简化为几行标准脚本。

CLI: Docker Build

在介绍这个命令前需要先简单了解一下个推的镜像体系:

前面提到我们将大部分依赖封装到了一个 npm 包,这一层封装也反映在个推的 Docker 镜像体系内,可以简单表述为下面的 Dockerfile:

# 公共依赖层的 Dockerfile  
FROM node:10  
RUN mkdir -p /usr/local/lib/webnode/node_modules \  
  && cd /usr/local/lib/webnode \  
  && npm install webnode  
ENV NODE_PATH /usr/local/lib/webnode/node_modules  
# 项目的 Dockerfile  
FROM getui/webnode:1.2.3  
COPY package*.json ./  
RUN npm install  
COPY . .

当把这层依赖直接做进 Docker 镜像时,虽然每个镜像的 SIZE 还是 1G 多,但是每个镜像的 UNIQUE SIZE 都是极小的,仅有数M的差分层。

一个简单的对比,比如有 800M 公共系统依赖 + 每个服务平均 200M 的 npm 依赖 + 1M 的服务代码,那么由于原先每个服务都会 npm install 大量重复依赖,20 个服务,就会有 800M + 200M 20 + 1M 20 = 4.82G 的总 UNIQUE SIZE。而采用依赖分层共享,则仅有 800M + 200M + 1M * 20 = 1.02G 的总 UNIQUE SIZE。在考虑应用的多版本之后,依赖分层共享带来在存储上的优势会更加明显。

我们以一定的依赖锁定周期和控制为代价,换取了:

  • 减少依赖组合、依赖版本组合的可能性,开发者选择包的简化、初始化项目的简化;审计简化、安全更新简化 。
  • CI 显著提速,节省等待时间。
  • 传输和存储的压力减少许多。
  • 公共依赖被多个项目使用,得到了更加充分的测试。
  • webnode docker build 命令可以帮助简化 Docker image 的构建过程,它内置了一个 Dockerfile 和dockerignore,该命令运行时,会基于这两个文件和当前的 Context,自动构建docker 镜像。其中 Dockerfile 内含一些优化和我们的最佳实践,开发人员只需要专注 Node.js 的项目的开发,这个命令则可以负责配置文件权限等操作以及生成标准化的、优化的 Docker 镜像。

其设计目标是:

  • 快:合理的依赖分层,最大程度应用 Docker 缓存机制,通过 .dockerignore 裁剪不必要的 Context,因此可以实现飞快的构建速度 。
  • 小:依据变更频度做 Docker 分层设计、应用 multi-stage build,尽最大可能缩小一个镜像的 UNIQUE SIZE 。
  • 可重现:同样的内容总是构建出相同的结果。
    以 node_modules 依赖优化为例,下面两种 Dockerfile 其实会有很大的区别:
FROM getui/webnode:1.2.3  
COPY . .  
RUN npm install  
FROM getui/webnode:1.2.3  
COPY package*.json ./  
RUN npm install  
COPY . .

前者,每次 docker build 时,只要项目内任何代码变了,npm install 的缓存都会失效,需要重新安装,而后者仅当 package*.json 发生改变之时才会触发重新 npm install。另外,我们还会对 package.json 进行预编译,仅保留依赖相关的字段,避免出现修改 package.json 的版本号就重新 npm install的情况。

webnode docker build 不仅可以帮助开发者进行统一化的镜像构建、统一实践最佳优化,节约资源,还能避免所有开发人员都需要接触优化细节,省时省力。

CLI: Webnode Docker Start

在本地调试开发的过程中,我们遇到了一些环境差异引起的问题:

  • 生产环境与本地开发环境 Node.js 版本不一致。
  • 一些含有 C++ 代码的 npm 依赖运行的跨平台问题 。
  • 文件权限配置、系统目录结构与线上运行环境不完全一致 。
  • 启动初始化流程不一致(比如配置预拉取)。
  • 开发本地常常缺少一些二进制工具或版本不一致(比如 consul-template、nc 等)。
  • 与本地直接启动 Node.js 程序有所不同,这个命令会优先基于当前项目利用上面的 webnode docker build 命令构建 Docker 镜像,然后启动镜像。

Docker 可以帮助消解环境差异:

  • 便捷地携带与生产环境一致的Node.js 版本以及其他二进制依赖。
  • 一致的初始化流程。
  • 轻松运行含有 C++ 的 npm 依赖。
  • 文件权限、目录结构与线上运行环境一致。
    容器化的Node.js调试方法有些许变化,需要暴露Node.js的Inspector端口,然后配一下Visual Studio Code的localRoot和remoteRoot:
WEBNODE_HOST=${WEBNODE_HOST:-127.0.0.1}  
WEBNODE_PORT=${WEBNODE_PORT:-3000}  
DOCKER_RUN_OPTIONS="$DOCKER_RUN_OPTIONS \   
   -it \  
   --rm \  
   --network=\"getui-dev\"  
   -p $WEBNODE_HOST:$WEBNODE_PORT:3000 \  
   -p 127.0.0.1:9229:9229 \  
   -e NODE_FLAGS=--inspect=0.0.0.0:9229 \  
   --name $CONTAINER"  
docker run \  
   $DOCKER_RUN_OPTIONS \  
   $DOCKER_IMAGE_TAG  
{  
   "version": "0.2.0",  
   "configurations": [  
       {  
           "type": "node",  
           "request": "attach",  
           "name": "Attach Local WebNode",  
           "address": "127.0.0.1",  
           "port": 9229,  
           "restart": true,  
           "protocol": "inspector",  
           "localRoot": "${workspaceFolder}",  
           "remoteRoot": "YOUR_REMOTE_ROOT",  
           "sourceMaps": true  
       },  
   ]  
}

基于容器开发 CLI 工具

基于容器的开发可以带来诸多好处。一是便于分发,基于 Docker 的 Tag,开发者可以很方便地做基于小版本、大版本、分支的分发,可以像 nvm 一样去切换版本。

二是CLI 脚本不用处处考虑跨平台兼容的问题,比如:

sed 在 Linux 和 Mac 下工作行为不一致的问题之类的。
有的环境有 Python 3 有的环境只有 Python 2
所有的依赖通过容器带进来,简洁而高效。

在基于 Docker 的工具开发的过程中,我们也遇到一些问题:

一是容器内外 UID/GID 不一致,如果是以非 ROOT 用户运行 docker run,会导致容器内程序在挂载的目录产生的文件权限与当前用户不一致。

Docker for Mac对于文件权限有一些特别的行为,具体可以参见:https://docs.docker.com/docker-for-mac/osxfs/#ownership

对于 Host 是 Linux 的情况,尤其在 CI 时,需要考虑 UID/GID 的问题。对于这种情况,我们选择覆盖掉了 entrypoint ,然后用 gosu 去做降权来处理。

CLI_EXEC_UID=${CLI_EXEC_UID:-0}  
CLI_EXEC_GID=${CLI_EXEC_GID:-0}  

exec gosu $CLI_EXEC_UID:$CLI_EXEC_GID env "$@"

其实RedHat 旗下用于设计container runtime 的daemonless (例如 podman),就很适合做CLI工具,可以 rootless 运行,又尊重系统的权限配置。然而其目前尚未成熟,业界采用率也不高,仍需要继续观望。

二是有时候 docker run 速度较慢,个推的解决方案是在首次启动时启动一个 docker run --detach,然后后续的 CLI 执行完全通过 docker exec 来进行,这样避免掉了每次执行命令时启动的开销,速度提升明显。

小结

以上便是个推 Node.js 微服务开发实践中关于 CLI 工具的实践,个推试图标准化、优化项目结构以及镜像构建,减少组合的可能性,有效降低了存储、传输、构建的成本,让开发人员更加省时省力。

后续我们还会继续为大家介绍个推的 Docker 镜像体系设计以及Node.js 微服务开发框架,敬请期待。

参考

https://docs.docker.com/docker-for-mac/osxfs/#ownership
https://docs.docker.com/develop/develop-images/dockerfile_best-practices/#entrypoint
https://www.projectatomic.io/blog/2018/02/reintroduction-podman/
https://www.slideshare.net/AkihiroSuda/the-state-of-rootless-containers
https://www.debian.org/doc/manuals/debian-faq/ch-pkg_basics.en.html#s-virtual

继续阅读 »

作者:个推Node.js 开发工程师 之诺

背景与摘要

由于工程数量的快速增长,个推在实践基于 Node.js 的微服务开发的过程中,遇到了如下问题:

  1. 每次新建项目都需要安装一次依赖,这些依赖之间基本相似却又有微妙的区别;

  2. 每次新建项目都要配置一遍相似的配置(比如 tsconfig、lint 规则等);

  3. 本地 Mac 环境与线上 Docker 内的 Linux 环境不一致(尤其是有 C++ 依赖的情况)。

为了解决上述问题,个推内部开发了一个命令行小工具来标准化项目初始化流程、简化配置甚至是零配置,提供基于 Docker 的一致构建、运行环境。

CLI: init, build, test & pack

新建一个 Node.js 项目的时候,我们一般会:

  1. 安装许多开发依赖:TypeScript、Jest、TSLint、benchmark、typedoc 等;

  2. 配置 tsconfig、lint 规则、.prettierrc 等;

  3. 安装众多项目依赖:koa、lodash、sequelize、ioredis、zipkin、node-fetch 等;

  4. 初始化目录结构;

  5. 配置CI 脚本。

通常,我们会选择复制一个现成的项目进行修改,导致出现众多看似相似却又不完全相同的项目,比如十个项目可能会对应十种配置组合。对于同时跨多个工程的开发人员来说,众多配置组合会增加他们的工作难度。而且,当安全审计发现某些 npm package 出现安全隐患时,开发人员则需要对每个引用这些包的项目逐一检查和修正。

在确定的开发场景下,几乎所有项目的开发依赖都差不多,开发配置也非常相似,因此我们基于 commander.js 写了一个 init 工具,它会开个命令行的向导,自动安装依赖、初始化项目目录结构和配置。从而创建项目,并按照场景将所有配置收缩为特定几种模板,进行统一处理。

随后,我们有了 build、test、pack 命令,托管了 tsconfig、jest 配置、打包配置,自动调用 tsc 编译,构建测试环境,然后调用 Jest 进行测试,进行标准化打包, CI 脚本基本可以简化为几行标准脚本。

CLI: Docker Build

在介绍这个命令前需要先简单了解一下个推的镜像体系:

前面提到我们将大部分依赖封装到了一个 npm 包,这一层封装也反映在个推的 Docker 镜像体系内,可以简单表述为下面的 Dockerfile:

# 公共依赖层的 Dockerfile  
FROM node:10  
RUN mkdir -p /usr/local/lib/webnode/node_modules \  
  && cd /usr/local/lib/webnode \  
  && npm install webnode  
ENV NODE_PATH /usr/local/lib/webnode/node_modules  
# 项目的 Dockerfile  
FROM getui/webnode:1.2.3  
COPY package*.json ./  
RUN npm install  
COPY . .

当把这层依赖直接做进 Docker 镜像时,虽然每个镜像的 SIZE 还是 1G 多,但是每个镜像的 UNIQUE SIZE 都是极小的,仅有数M的差分层。

一个简单的对比,比如有 800M 公共系统依赖 + 每个服务平均 200M 的 npm 依赖 + 1M 的服务代码,那么由于原先每个服务都会 npm install 大量重复依赖,20 个服务,就会有 800M + 200M 20 + 1M 20 = 4.82G 的总 UNIQUE SIZE。而采用依赖分层共享,则仅有 800M + 200M + 1M * 20 = 1.02G 的总 UNIQUE SIZE。在考虑应用的多版本之后,依赖分层共享带来在存储上的优势会更加明显。

我们以一定的依赖锁定周期和控制为代价,换取了:

  • 减少依赖组合、依赖版本组合的可能性,开发者选择包的简化、初始化项目的简化;审计简化、安全更新简化 。
  • CI 显著提速,节省等待时间。
  • 传输和存储的压力减少许多。
  • 公共依赖被多个项目使用,得到了更加充分的测试。
  • webnode docker build 命令可以帮助简化 Docker image 的构建过程,它内置了一个 Dockerfile 和dockerignore,该命令运行时,会基于这两个文件和当前的 Context,自动构建docker 镜像。其中 Dockerfile 内含一些优化和我们的最佳实践,开发人员只需要专注 Node.js 的项目的开发,这个命令则可以负责配置文件权限等操作以及生成标准化的、优化的 Docker 镜像。

其设计目标是:

  • 快:合理的依赖分层,最大程度应用 Docker 缓存机制,通过 .dockerignore 裁剪不必要的 Context,因此可以实现飞快的构建速度 。
  • 小:依据变更频度做 Docker 分层设计、应用 multi-stage build,尽最大可能缩小一个镜像的 UNIQUE SIZE 。
  • 可重现:同样的内容总是构建出相同的结果。
    以 node_modules 依赖优化为例,下面两种 Dockerfile 其实会有很大的区别:
FROM getui/webnode:1.2.3  
COPY . .  
RUN npm install  
FROM getui/webnode:1.2.3  
COPY package*.json ./  
RUN npm install  
COPY . .

前者,每次 docker build 时,只要项目内任何代码变了,npm install 的缓存都会失效,需要重新安装,而后者仅当 package*.json 发生改变之时才会触发重新 npm install。另外,我们还会对 package.json 进行预编译,仅保留依赖相关的字段,避免出现修改 package.json 的版本号就重新 npm install的情况。

webnode docker build 不仅可以帮助开发者进行统一化的镜像构建、统一实践最佳优化,节约资源,还能避免所有开发人员都需要接触优化细节,省时省力。

CLI: Webnode Docker Start

在本地调试开发的过程中,我们遇到了一些环境差异引起的问题:

  • 生产环境与本地开发环境 Node.js 版本不一致。
  • 一些含有 C++ 代码的 npm 依赖运行的跨平台问题 。
  • 文件权限配置、系统目录结构与线上运行环境不完全一致 。
  • 启动初始化流程不一致(比如配置预拉取)。
  • 开发本地常常缺少一些二进制工具或版本不一致(比如 consul-template、nc 等)。
  • 与本地直接启动 Node.js 程序有所不同,这个命令会优先基于当前项目利用上面的 webnode docker build 命令构建 Docker 镜像,然后启动镜像。

Docker 可以帮助消解环境差异:

  • 便捷地携带与生产环境一致的Node.js 版本以及其他二进制依赖。
  • 一致的初始化流程。
  • 轻松运行含有 C++ 的 npm 依赖。
  • 文件权限、目录结构与线上运行环境一致。
    容器化的Node.js调试方法有些许变化,需要暴露Node.js的Inspector端口,然后配一下Visual Studio Code的localRoot和remoteRoot:
WEBNODE_HOST=${WEBNODE_HOST:-127.0.0.1}  
WEBNODE_PORT=${WEBNODE_PORT:-3000}  
DOCKER_RUN_OPTIONS="$DOCKER_RUN_OPTIONS \   
   -it \  
   --rm \  
   --network=\"getui-dev\"  
   -p $WEBNODE_HOST:$WEBNODE_PORT:3000 \  
   -p 127.0.0.1:9229:9229 \  
   -e NODE_FLAGS=--inspect=0.0.0.0:9229 \  
   --name $CONTAINER"  
docker run \  
   $DOCKER_RUN_OPTIONS \  
   $DOCKER_IMAGE_TAG  
{  
   "version": "0.2.0",  
   "configurations": [  
       {  
           "type": "node",  
           "request": "attach",  
           "name": "Attach Local WebNode",  
           "address": "127.0.0.1",  
           "port": 9229,  
           "restart": true,  
           "protocol": "inspector",  
           "localRoot": "${workspaceFolder}",  
           "remoteRoot": "YOUR_REMOTE_ROOT",  
           "sourceMaps": true  
       },  
   ]  
}

基于容器开发 CLI 工具

基于容器的开发可以带来诸多好处。一是便于分发,基于 Docker 的 Tag,开发者可以很方便地做基于小版本、大版本、分支的分发,可以像 nvm 一样去切换版本。

二是CLI 脚本不用处处考虑跨平台兼容的问题,比如:

sed 在 Linux 和 Mac 下工作行为不一致的问题之类的。
有的环境有 Python 3 有的环境只有 Python 2
所有的依赖通过容器带进来,简洁而高效。

在基于 Docker 的工具开发的过程中,我们也遇到一些问题:

一是容器内外 UID/GID 不一致,如果是以非 ROOT 用户运行 docker run,会导致容器内程序在挂载的目录产生的文件权限与当前用户不一致。

Docker for Mac对于文件权限有一些特别的行为,具体可以参见:https://docs.docker.com/docker-for-mac/osxfs/#ownership

对于 Host 是 Linux 的情况,尤其在 CI 时,需要考虑 UID/GID 的问题。对于这种情况,我们选择覆盖掉了 entrypoint ,然后用 gosu 去做降权来处理。

CLI_EXEC_UID=${CLI_EXEC_UID:-0}  
CLI_EXEC_GID=${CLI_EXEC_GID:-0}  

exec gosu $CLI_EXEC_UID:$CLI_EXEC_GID env "$@"

其实RedHat 旗下用于设计container runtime 的daemonless (例如 podman),就很适合做CLI工具,可以 rootless 运行,又尊重系统的权限配置。然而其目前尚未成熟,业界采用率也不高,仍需要继续观望。

二是有时候 docker run 速度较慢,个推的解决方案是在首次启动时启动一个 docker run --detach,然后后续的 CLI 执行完全通过 docker exec 来进行,这样避免掉了每次执行命令时启动的开销,速度提升明显。

小结

以上便是个推 Node.js 微服务开发实践中关于 CLI 工具的实践,个推试图标准化、优化项目结构以及镜像构建,减少组合的可能性,有效降低了存储、传输、构建的成本,让开发人员更加省时省力。

后续我们还会继续为大家介绍个推的 Docker 镜像体系设计以及Node.js 微服务开发框架,敬请期待。

参考

https://docs.docker.com/docker-for-mac/osxfs/#ownership
https://docs.docker.com/develop/develop-images/dockerfile_best-practices/#entrypoint
https://www.projectatomic.io/blog/2018/02/reintroduction-podman/
https://www.slideshare.net/AkihiroSuda/the-state-of-rootless-containers
https://www.debian.org/doc/manuals/debian-faq/ch-pkg_basics.en.html#s-virtual

收起阅读 »

uni-app项目数字滚动

uniapp插件 uniapp

uni-app项目数字滚动

github地址,喜欢的可以star下哦

插件预览图

使用教程

1.插件代码拷贝

  • 下载后把components目录下countUp.vue文件拷贝到自己项目目录下

2.插件全局配置

  • 在项目里main.js中配置如下代码
import countUp from './components/countUp.vue'  

Vue.component('countup',countUp)  

3.插件使用

  • vue页面使用
<template>  
    <view>  
        <countup :num="num" color="#ff9e50" width='13' height='23' fontSize='23'></countup>  
        <button @tap="add">Add</button>  
        <button @tap="reduce">Reduce</button>  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {  
            num:123.453  
        };  
    },  
    onLoad() {},  
    methods: {  
        add() {  
            this.num=++this.num;  
        },  
        reduce(){  
            this.num=--this.num;  
        }  
    }  
};  
</script>  
兼容性

uni-app项目中使用都兼容

继续阅读 »

uni-app项目数字滚动

github地址,喜欢的可以star下哦

插件预览图

使用教程

1.插件代码拷贝

  • 下载后把components目录下countUp.vue文件拷贝到自己项目目录下

2.插件全局配置

  • 在项目里main.js中配置如下代码
import countUp from './components/countUp.vue'  

Vue.component('countup',countUp)  

3.插件使用

  • vue页面使用
<template>  
    <view>  
        <countup :num="num" color="#ff9e50" width='13' height='23' fontSize='23'></countup>  
        <button @tap="add">Add</button>  
        <button @tap="reduce">Reduce</button>  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {  
            num:123.453  
        };  
    },  
    onLoad() {},  
    methods: {  
        add() {  
            this.num=++this.num;  
        },  
        reduce(){  
            this.num=--this.num;  
        }  
    }  
};  
</script>  
兼容性

uni-app项目中使用都兼容

收起阅读 »

uni-app自定义验证码、密码输入框

Vue uniapp

Getting started

github地址,喜欢的可以star下哦

插件预览图

使用教程

1.插件代码拷贝

  • 下载后把components目录下validCode.vue文件拷贝到自己项目目录下

2.插件全局配置

  • 在项目里main.js中配置如下代码
import validCode from './components/validCode.vue'  

Vue.component('validcode',validCode)  

3.插件使用

  • vue页面使用
<template>  
    <view class="content">  
        <view>验证码:</view>  
        <validcode :maxlength="4" :isPwd="false" @finish="getCode"></validcode>  
        <view>密码:</view>  
        <validcode :maxlength="6" :isPwd="true" @finish="getPwd"></validcode>  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {};  
    },  
    onLoad() {},  
    methods: {  
        getCode(val) {  
            console.log(val);  
        },  
        getPwd(val){  
            console.log(val);  
        }  
    }  
};  
</script>  

<style>  
.content {  
    height: 400upx;  
}  
</style>  
继续阅读 »

Getting started

github地址,喜欢的可以star下哦

插件预览图

使用教程

1.插件代码拷贝

  • 下载后把components目录下validCode.vue文件拷贝到自己项目目录下

2.插件全局配置

  • 在项目里main.js中配置如下代码
import validCode from './components/validCode.vue'  

Vue.component('validcode',validCode)  

3.插件使用

  • vue页面使用
<template>  
    <view class="content">  
        <view>验证码:</view>  
        <validcode :maxlength="4" :isPwd="false" @finish="getCode"></validcode>  
        <view>密码:</view>  
        <validcode :maxlength="6" :isPwd="true" @finish="getPwd"></validcode>  
    </view>  
</template>  

<script>  
export default {  
    data() {  
        return {};  
    },  
    onLoad() {},  
    methods: {  
        getCode(val) {  
            console.log(val);  
        },  
        getPwd(val){  
            console.log(val);  
        }  
    }  
};  
</script>  

<style>  
.content {  
    height: 400upx;  
}  
</style>  
收起阅读 »

力谱云App开发技术口碑持续攀升,高性价比服务实现行业突围

移动APP

随着移动技术的进一步开花结果,目前全球移动市场正在斗转星移,企业技术力量也正在重新洗牌匹配。应社会大众所需,和开发APP/小程序技术的进一步成熟,需求与技术两者强力融合,让拼多多、云集微店、小红书、兴盛优选、松鼠拼拼等等,这些APP/小程序一夕之间火爆全国市场,盈利能力撼动全球企业家目光的移动电商平台,正在向世界揭示着未来商海的大发展趋势。目前,一家在上海的移动研发企业,上海力谱宿云信息科技有限公司,也正应用其创新的云计算模式“SaaS PaaS”,通过移动电商App云开发平台——> 力谱云**,为众多中小企业提供着高性价比的移动电商平台开发服务,其平台口碑目前深受业内外好评。

SaaS PaaS创新云计算技术,革新App开发服务行业壁垒

技术是第一生产力。所有的研发企业,如果没有自身技术加持,很难突围行业壁垒,对App开发市场来说,同样如此。从传统手机APP定制行业角度来说,开发成本高昂与交付周期冗长,成为了众多企业无法开发一个属于自己的专属电商平台的关键所在。对此,力谱云平台另辟蹊径,通过SaaS与PaaS相结合的创新型云计算模式,一举革新了App开发服务行业的技术壁垒,不仅能大幅压缩技术成本,更能提升平台制作与上线效率,深受各行业企业主的口碑肯定。

力谱云:移动电商平台的技术先锋

从技术上来说,力谱云实现了里程碑式的跨越,其不到传统App开发成本1成的高性价比服务,以及业内外的良好口碑,为其打开了全国应用开发市场的大门。另外,在过去的一年中,上海力谱宿云信息科技有限公司的技术研发实力,也在不断攀升中,尤其在技术方面,更是进行了大幅的人员吸纳与团队扩张。在解决方案方面,目前领先支持社交电商、生鲜配送、社区团购、服务预订等电商创富方向,为众多企业移动化转型提供一站式技术服务支持。

拥有移动应用平台,拥有未来商圈发言权

随着目前移动互联网的全面性覆盖,据统计,2018年中国手机App消费占全球应用消费量的40%,其下载量占全球应用平台下载量的50%。数据一经发表,全球哗然,因为这预示着,在未来的商业圈内,无论是在中国还是全球,移动互联网将加速实现商业运行模式上的巨大变革。而这股浪潮,将直接决定企业在未来数年内的生息与发展。坦言说,这是一个全新的盈利通道,如果企业仍然没有开发一款属于自己的移动App平台,在未来,将无法获得相应的行业发言权。来拥抱移动互联网吧!通过像力谱云这样享誉业内口碑的App开发平台,企业主就可以轻松跳跃技术成本、运营成本的压制,轻松实现线上线下业务的融合,碰撞出新的商业火花。入局移动互联网,让商业拥有无限可能!

继续阅读 »

随着移动技术的进一步开花结果,目前全球移动市场正在斗转星移,企业技术力量也正在重新洗牌匹配。应社会大众所需,和开发APP/小程序技术的进一步成熟,需求与技术两者强力融合,让拼多多、云集微店、小红书、兴盛优选、松鼠拼拼等等,这些APP/小程序一夕之间火爆全国市场,盈利能力撼动全球企业家目光的移动电商平台,正在向世界揭示着未来商海的大发展趋势。目前,一家在上海的移动研发企业,上海力谱宿云信息科技有限公司,也正应用其创新的云计算模式“SaaS PaaS”,通过移动电商App云开发平台——> 力谱云**,为众多中小企业提供着高性价比的移动电商平台开发服务,其平台口碑目前深受业内外好评。

SaaS PaaS创新云计算技术,革新App开发服务行业壁垒

技术是第一生产力。所有的研发企业,如果没有自身技术加持,很难突围行业壁垒,对App开发市场来说,同样如此。从传统手机APP定制行业角度来说,开发成本高昂与交付周期冗长,成为了众多企业无法开发一个属于自己的专属电商平台的关键所在。对此,力谱云平台另辟蹊径,通过SaaS与PaaS相结合的创新型云计算模式,一举革新了App开发服务行业的技术壁垒,不仅能大幅压缩技术成本,更能提升平台制作与上线效率,深受各行业企业主的口碑肯定。

力谱云:移动电商平台的技术先锋

从技术上来说,力谱云实现了里程碑式的跨越,其不到传统App开发成本1成的高性价比服务,以及业内外的良好口碑,为其打开了全国应用开发市场的大门。另外,在过去的一年中,上海力谱宿云信息科技有限公司的技术研发实力,也在不断攀升中,尤其在技术方面,更是进行了大幅的人员吸纳与团队扩张。在解决方案方面,目前领先支持社交电商、生鲜配送、社区团购、服务预订等电商创富方向,为众多企业移动化转型提供一站式技术服务支持。

拥有移动应用平台,拥有未来商圈发言权

随着目前移动互联网的全面性覆盖,据统计,2018年中国手机App消费占全球应用消费量的40%,其下载量占全球应用平台下载量的50%。数据一经发表,全球哗然,因为这预示着,在未来的商业圈内,无论是在中国还是全球,移动互联网将加速实现商业运行模式上的巨大变革。而这股浪潮,将直接决定企业在未来数年内的生息与发展。坦言说,这是一个全新的盈利通道,如果企业仍然没有开发一款属于自己的移动App平台,在未来,将无法获得相应的行业发言权。来拥抱移动互联网吧!通过像力谱云这样享誉业内口碑的App开发平台,企业主就可以轻松跳跃技术成本、运营成本的压制,轻松实现线上线下业务的融合,碰撞出新的商业火花。入局移动互联网,让商业拥有无限可能!

收起阅读 »

我是开发者承接各种程序外包,前后端都能干,15036787063

外包 App 小程序

有需要的加好友,微信:15036787063
QQ:577715766

有需要的加好友,微信:15036787063
QQ:577715766

西安招聘 混合APP开发者

西安招聘多端APP开发者,要求会Hbuildx,uniapp,mui,联系QQ:1319346578

西安招聘多端APP开发者,要求会Hbuildx,uniapp,mui,联系QQ:1319346578

【完整项目分享】纯Html5+MUI实现的移动端电子书阅读APP

首先呢,我是个文笔不太好的女产品经理,请大家不要抨击我的文笔。。。
这个项目从头到尾我都有参与,因为我做过一段时间前端工程师,所以偶尔也帮忙做一下技术调查类的工作(创业公司,你懂的!)。话不多说,切入正题!!!

一、技术选型
(略)我虽然参与他们的讨论,但是翻邮件的时候发现,都是唠家常的。。。此处尴尬。。。大概意思就是DCloud更适合!!!其他的RN难度大、APICloud刚赔了钱给DCloud、Flutter难度更大不够快等等。。。

二、功能说明
这个嘛!主要是分享一下这个APP主要是干啥的,有哪些功能,里面可能会有一些点大家有共同点,权当抛砖引玉。

    概要介绍:一款基于区块链通证经济的电子书阅读APP(读书即挖矿),每天读书就可以获得一定的通证奖励,通证就是类似比特币那种。  

    通用功能:登录/注册、检查更新、通知、支付、文件下载/上传(阿里云OSS)等等。  

    特色功能:EPub格式电子书阅读器。  

三、界面截图

闪屏页广告
闪屏页广告
登陆页
登陆页
个人中心
个人中心
头像设置
头像设置
首页
首页
书架
书架
电子书阅读
电子书阅读
侧栏目录
侧栏目录
换个背景
换个背景
分类导航
分类导航
沉浸式
沉浸式
沉浸式
沉浸式
购物车
购物车

好啦!还有很多很多页面,就不截图了!!!

四、开发问题
1、部分Vivo、oppo手机无法打开app或者白屏(未解决,解决后分享给大家)
2、Iphone底部导航栏被遮盖(未解决,解决后分享给大家)
3、其他一些小问题还没有解决,不过很快啦!

五、下载体验(微信扫码)
目前刚上线安卓版,IOS在调试问题!
购物车

继续阅读 »

首先呢,我是个文笔不太好的女产品经理,请大家不要抨击我的文笔。。。
这个项目从头到尾我都有参与,因为我做过一段时间前端工程师,所以偶尔也帮忙做一下技术调查类的工作(创业公司,你懂的!)。话不多说,切入正题!!!

一、技术选型
(略)我虽然参与他们的讨论,但是翻邮件的时候发现,都是唠家常的。。。此处尴尬。。。大概意思就是DCloud更适合!!!其他的RN难度大、APICloud刚赔了钱给DCloud、Flutter难度更大不够快等等。。。

二、功能说明
这个嘛!主要是分享一下这个APP主要是干啥的,有哪些功能,里面可能会有一些点大家有共同点,权当抛砖引玉。

    概要介绍:一款基于区块链通证经济的电子书阅读APP(读书即挖矿),每天读书就可以获得一定的通证奖励,通证就是类似比特币那种。  

    通用功能:登录/注册、检查更新、通知、支付、文件下载/上传(阿里云OSS)等等。  

    特色功能:EPub格式电子书阅读器。  

三、界面截图

闪屏页广告
闪屏页广告
登陆页
登陆页
个人中心
个人中心
头像设置
头像设置
首页
首页
书架
书架
电子书阅读
电子书阅读
侧栏目录
侧栏目录
换个背景
换个背景
分类导航
分类导航
沉浸式
沉浸式
沉浸式
沉浸式
购物车
购物车

好啦!还有很多很多页面,就不截图了!!!

四、开发问题
1、部分Vivo、oppo手机无法打开app或者白屏(未解决,解决后分享给大家)
2、Iphone底部导航栏被遮盖(未解决,解决后分享给大家)
3、其他一些小问题还没有解决,不过很快啦!

五、下载体验(微信扫码)
目前刚上线安卓版,IOS在调试问题!
购物车

收起阅读 »

HBuilder X无法检测到手机或者模拟器最后一招解决方案

我也是经常遇到这个问题,老是检测不到模拟器或者手机。
其实这是adb的问题,我们只需要通过电脑的cmd命令行手动检测设备就好了!

adb命令的使用:

1、找到HBuilder X 的目录
2、找到HBuilder X 带的adb程序,将此程序在的路径复制,放到Path中(环境变量)

配置环境变量:
我的电脑->鼠标右键->高级系统设置->高级->环境变量->path->双击,新建->粘贴adbs目录地址即可

继续阅读 »

我也是经常遇到这个问题,老是检测不到模拟器或者手机。
其实这是adb的问题,我们只需要通过电脑的cmd命令行手动检测设备就好了!

adb命令的使用:

1、找到HBuilder X 的目录
2、找到HBuilder X 带的adb程序,将此程序在的路径复制,放到Path中(环境变量)

配置环境变量:
我的电脑->鼠标右键->高级系统设置->高级->环境变量->path->双击,新建->粘贴adbs目录地址即可

收起阅读 »

mui仿有赞微信端用户注册登录界面模板

mui

绿色风格的一款mui仿有赞微信端用户注册登录界面模板,还带有手机号码、密码验证效果
模板下载:https://www.sucaihuo.com/templates/1582.html

继续阅读 »

绿色风格的一款mui仿有赞微信端用户注册登录界面模板,还带有手机号码、密码验证效果
模板下载:https://www.sucaihuo.com/templates/1582.html

收起阅读 »

HBuilder X开发uni-app项目如何使用mumu模拟器调试。

调试 mumu模拟器
  1. 到mumu官网下载并安装模拟器并记住安装路劲,后面设置adb有用。

  2. 打开mumu设置,找到开发者选项打开USB调试。

  3. 打开HBuilder开发工具,依次选择菜单 运行->运行到手机模拟器->Android模拟器端口设置

    • 设置adb路径,未MuMu安装目录下 ./emulator/nemu/vmonitor/bin/adbserver.exe (不要复制,请自定手动浏览选择!--||)
    • 设置Android模拟器端口 7555 (这是是在网上找的,如果不行请百度一下)。
  4. 这时候模拟器运行项就出来了,依次选择(也可以直接选择快捷运行按钮,在菜单栏下面类似一个播放按钮)运行->运行到手机模拟器->运行-[设备mumu]-[项目名称] 即可

  5. 注意.mumu模拟器的运行配置不建议设置太好,会增加崩溃的几率,还有就是建议把mumu模拟器的窗口置顶勾上,可以增加调试稳定性。

继续阅读 »
  1. 到mumu官网下载并安装模拟器并记住安装路劲,后面设置adb有用。

  2. 打开mumu设置,找到开发者选项打开USB调试。

  3. 打开HBuilder开发工具,依次选择菜单 运行->运行到手机模拟器->Android模拟器端口设置

    • 设置adb路径,未MuMu安装目录下 ./emulator/nemu/vmonitor/bin/adbserver.exe (不要复制,请自定手动浏览选择!--||)
    • 设置Android模拟器端口 7555 (这是是在网上找的,如果不行请百度一下)。
  4. 这时候模拟器运行项就出来了,依次选择(也可以直接选择快捷运行按钮,在菜单栏下面类似一个播放按钮)运行->运行到手机模拟器->运行-[设备mumu]-[项目名称] 即可

  5. 注意.mumu模拟器的运行配置不建议设置太好,会增加崩溃的几率,还有就是建议把mumu模拟器的窗口置顶勾上,可以增加调试稳定性。

收起阅读 »