多端统一开发工具——kbone
kbone 是一个致力于微信小程序和 Web 端同构的解决方案。
简介
微信小程序的底层模型和 Web 端不同，我们想直接把 Web 端的代码挪到小程序环境内执行是不可能的。kbone 的诞生就是为了解决这个问题，它实现了一个适配器，在适配层里模拟出了浏览器环境，让 Web 端的代码可以不做什么改动便可运行在小程序里。
kbone的优势
(1) 大部分流行的前端框架都能够在 kbone 上运行，比如 Vue、React、Preact 等。
(2) 支持更为完整的前端框架特性，因为 kbone 不会对框架底层进行删改（比如 Vue 中的 v-html 指令、Vue-router 插件）。
(3) 提供了常用的 dom/bom 接口，让用户代码无需做太大改动便可从 Web 端迁移到小程序端。
(4) 在小程序端运行时，仍然可以使用小程序本身的特性（比如像 live-player 内置组件、分包功能）。
(5) 提供了一些 Dom 扩展接口，让一些无法完美兼容到小程序端的接口也有替代使用方案（比如 getComputedStyle 接口）。
kbone的使用
为了可以让开发者可以更自由地进行项目的搭建，微信官方提供了三种开发方式：
- 使用kbone-cli快速开发
- 使用模板快速开发
- 手动配置开发
本文使用kbone-cli快速开发
1.安装kbone-cli
npm install -g kbone-cli
2.创建项目
kbone init my-app
3.创建项目成功后选择kbone-ui多端ui库开发
kbone-ui 是一个能同时支持 小程序(kbone) 和 vue 框架开发的多端 UI 库。
- 即可以基于 kbone 同时开发小程序和 H5，也可以单独使用开发 H5 应用。
- 支持以 Vue 语法来支持 H5 端和小程序端运行
- 对齐 微信weui 样式组件
安装完kbone-ui后，我们可以看到一些开发和bulid的命令
4.开发小程序执行npm run mp
5. 执行成功后，可以看到对应的目录下已经生成一些微信小程序的文件
6.打开微信小程序开发工具，导入项目，编译运行
至此，我们完成了小程序Kbone开发环境搭建。