kbone的基础安装及介绍,这里不再过多介绍,感兴趣的童鞋可以看看官方的 文章 及 gitbook(文档)
什么是Kbone?
Kbone 是由 微信小程序 官方团队推出的 H5 及 微信小程序 同构脚手架,可使同一套代码分别运行在 H5 及 微信小程序 平台,极大减少了开发者(前端)的工作量。
为什么是Kbone?
相信一部分童鞋在之前已经了解过同类型的其他脚手架,如 uni-app 、mpvue、trao 等。既然市面上已经有这么多脚手架了,为什么 微信小程序 官方依然会推出 kbone 呢?难道是他们并不知道有其他的脚手架?
答案是否定的,他们当然也知道其他脚手架,也尝试使用过。
编者之前也就一些问题咨询过相关的开发人员,也就一些问题进行过讨论。在之后也进行过一些尝试。得出结论:在 微信小程序 环境中,Kbone 所编译出来的代码,运行效率高于其他脚手架(不愧是你们,微信小程序的官方开发团队,居然还偷偷做了优化)。
不过目前,Kbone 仅支持编译成 H5 及 微信小程序,如果需要上其他平台,如 支付宝小程序、__抖音小程序__等等,估计还需要等一等(不过,猜测近段时间不会支持吧)。
这里推荐 祺爸💎 的文章《微信小程序转其他端小程序实战》,也是一个不错的解决方案。仅需要将 Kbone 预先编译成 微信小程序,然后再转成其他小程序即可。
当然,如果你说的是APP,那自己想办法吧。
Kbone起步的一些坑
一、
这应该是一个残留bug,之前是需要在__微信小程序__中使用 npm构建 安装一些库的,但是目前来看已经不需要了,删除 miniprogram-element 文件夹即可
二、
这也是一个老问题了,每次修改 Kbone 代码重新编译后,微信开发者工具 均会报这个错误。这是因为在 Kbone 中未配置 微信小程序 的 AppID,在 Kbone 项目中找到 build/miniprogram.config.js ,然后拉到最下面,填写 projectConfig: { appid: ‘’ } 的值即可(需退出编译模式,重新编译)
例:
// 项目配置,会被合并到 project.config.json
projectConfig: {
projectname: 'kbone-template-vue',
appid: 'wxd****7ff****8f4f',
}
Kbone的后续
当然,目前 Kbone 依然有很多不足,甚至可以说匪夷所思的地方,但是毕竟是一个新兴脚手架,在可以理解的范围内。Kbone 的团队也在持续优化、维护、升级,相信未来能更好~
写在后面
至此,Kbone 的项目算是成功搭建,并且正常运行了,如果在使用过程中,有遇到其他问题,欢迎来此文章提出,编者会尽量回复。
最后,推荐一下 pohunchn/kbone-vue 的模版,此模版是基于官方kbone-vue模版所制作的 vue 模版,可使上手更为方便(不用再手动去修改 AppID 啦,也能直接去掉繁琐的 Eslint 啦!)。
vue init pohunchn/kbone-vue my-app
执行以上方法即可安装,是不是很简单!