关于前端:Taro调研

领导大腿一拍，要从企业微信迁到飞书，曾经上线或者开发中的利用，须要进行迁徙工作量的评估。
为了预防哪一天，领导再次大腿一拍，想迁徙到钉钉，于是想到了 Taro。

开放式跨端跨框架解决方案，反对应用 React/Vue/Nerv 等框架来开发微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ 小程序 / H5 等利用。

总而言之，就是一套代码，能够编译成多个平台的小程序代码。

而且反对本人拓展其余平台的编译插件。

采纳 vue 进行开发时，大部分写法都是统一的，只有多数写法，Taro 做了扭转。

比方 template 里的元素，采纳的是小程序的元素名称
div ---> view
元素的事件绑定
@click/v-on:click ---> @tap/v-on:tap
不反对<style scoped>
<style scoped> ---> cssModules
生命周期

Taro	阐明
onReady	小程序
onLoad	小程序
created	Vue、小程序
mounted	Vue
beforeUpdate	Vue
updated	Vue
beforeUnmount	Vue
unmounted	Vue、小程序（onUnload）
onShow	小程序
onHide	小程序

我的项目配置
我的项目配置依据平台不同配置不同的 project.XX.json 文件
尺寸
在 Taro 中尺寸单位倡议应用 px、百分比 %，Taro 默认会对所有单位进行转换。在 Taro 中书写尺寸依照 1:1 的关系来进行书写，即从设计稿上量的长度 100px，那么尺寸书写就是 100px，当转成微信小程序的时候，尺寸将默认转换为 100rpx，当转成 H5 时将默认转换为以 rem 为单位的值
API
基本一致，只是 wx.XXX 变成Taro.XXX

创立
Taro 提供相应的@tarojs/cli 用于创立 Taro 我的项目

运行
Taro 我的项目在 package.json 配置好相应平台的执行命令，通过 npm 命令，编译成不同端的代码

"scripts": {
"build:weapp": "taro build --type weapp",
"build:swan": "taro build --type swan",
"build:alipay": "taro build --type alipay",
"build:tt": "taro build --type tt",     // 字节小程序
"build:h5": "taro build --type h5",     // H5
"build:rn": "taro build --type rn",     // react native
"build:qq": "taro build --type qq",     // QQ 小程序
"build:jd": "taro build --type jd",     // 京东小程序
"build:quickapp": "taro build --type quickapp",
"dev:weapp": "npm run build:weapp -- --watch",
"dev:swan": "npm run build:swan -- --watch",
"dev:alipay": "npm run build:alipay -- --watch",
"dev:tt": "npm run build:tt -- --watch", 
"dev:h5": "npm run build:h5 -- --watch",
"dev:rn": "npm run build:rn -- --watch",
"dev:qq": "npm run build:qq -- --watch",
"dev:jd": "npm run build:jd -- --watch",
"dev:quickapp": "npm run build:quickapp -- --watch"
},

查看、调试
应用相应平台的开发工具，查看成果和调试

不过遗憾的是，Taro 不反对飞书小程序，折中的计划是采纳编译成字节小程序。毕竟飞书字节一家亲嘛，API 也查不到哪里去。然而当初大型 APP 那么多，各家都创始了一套属于本人的小程序，如果每家都反对，Taro 须要投入的，真的很可观。

于是乎，Taro 引入插件的理念，自 v3.1.0 起，将每个小程序平台的兼容逻辑抽取进去，以插件模式注入 Taro 框架，用户也能够本人扩大相应的平台。

关于前端:Taro调研

背景

Taro 介绍

比照

与 Vue 比拟

与微信小程序的比拟

开发模式

扩大