经验总结

  1. 首页 > 生活 > >

从 Wepy 到 UniApp 变形记( 九 )

生活百科


<template><!--...--></template><script>export default {props: ['data', 'compName'],computed: {item() {return data.item},pic() {return data.pic}}}</script>3.处理 < import/ >和< include/ >两种引入方式
wepy模板有两种引入组件的方式，一种是使用< import/ >< script/ >标签对进行引入，还有一种是使用< include/ > 进行引入，< include/ > 会引入WXML文件中除了< template/ >和< wxs/ >的其他标签 。这里的处理方式就比较简单，我们把< include/ > 会引入的部分单独抽取出来，生成TItem-incl.vue文件，这样即保证了生成代码的可复用性，也降低< import/ >标签引入的部分生成的TItem.vue文件中的逻辑复杂度 。生成的两个文件的结构如下：
<!--TItem.vue--><template><view><template v-if="compName == 'foo'"><view class="foo"><!--...--></view></template><template v-if="compName == 'bar'"><view class="bar"><!--...--></view></template></view></template><script>export default {props: ['compName', 'data'],computed: {item() {return this.data.item},pic() {return this.data.pic}}}</script><!--TItem-incl.vue--><template><view><view class="footer">this is footer</view></view></template>六、阶段性成果截止到目前，司内的企微导购小程序项目通过接入变色龙编译器已经顺利的从 wepy 迁移到了 uniApp 架构，原本预计需要 25人/天 的迁移工作量在使用了编译器转换后缩短到了 10s 。这不仅仅只是提高了迁移的效率，也降低了迁移中的知识迁移成本，给后续业务上的快速迭代奠定的扎实的基础 。
迁移后的企微导购小程序项目经测试阶段验证业务功能 0 bug，目前已经顺利上线 。后续我们也会持续收集其他类似的业务诉求，帮助业务兄弟们低成本完成迁移 。
七、总结研发能效的提升是个永恒的话题，此次我们从编译这个角度出发，和大家分享了从wepy到uniapp的架构升级探索的过程，通过构建代码转换的编译器来提升整体的架构升级效率，通过编译器消化底层的领域和知识的差异性，取得了不错的效果 。
当然，我们目前也有还不够完善的地方，如：编译器脚手架缺乏对于部分特性颗粒度更细的控制、代码编译转换过程中日志的输出更友好等等 。后续我们也有计划将 wepy 变色龙编译器在社区开源共建，届时欢迎大家一起参与进来 。
现阶段编译在前端的使用场景越来越多，或许我们真的进入了Compiler is our framework的时代 。

经验总结扩展阅读


上一篇：讽刺自己多余的句子 突然发现自己是多余的说说

下一篇：感觉自己有点多余的句子 我是一个多余的人说说