当前位置: 首页 > 文档资料 > BUI-Weex 开发手册 >

BUI-Weex概述

优质
小牛编辑
135浏览
2023-12-01

BUI-Weex概述 - 图1

BUI-Weex概述

BUI-Weex 是一套专门为 Weex 前端开发者打造的一套高质量UI框架。为了达到更好的效果,请在 WeexSDK 0.11.0 + 上使用这套UI框架。BUI-Weex致力于为iOSandroid平台提供丰富的UI组件,帮助开发者快速构建移动应用。

工具集

BUI-Weex 提供了一系列的开源工具集,包括:

  • bui-weex 组件库: 托管在NPM上。bui-weex 是以 node_module 的方式存在的,更新组件库需要修改 package.json 版本号。该组件库可以独立使用,配合weex的工程即可,推荐使用我们提供的脚手架工程。
  • bui-weex-toolkit 命令行工具:托管在NPM上。需要安装到全局。该工具可以通过命令行快速创建脚手架工程和查看最新的脚手架工程。
  • bui-weex-template 脚手架工程:基于weex官方的工程改造的,配合bui-weex组件库可以发挥更强的威力。托管在github上,下载即可使用。推荐使用 toolkit 来创建。

bui-weex-toolkitbui-weex-template 对于weex开发者来说是可选的。

示例预览

请使用Playground扫描下面二维码即可查看效果 (Playground是weex提供的安装在手机端的调试工具):

BUI-Weex概述 - 图7

沟通交流

我们的GitHub仓库

bui-weex组件库 https://github.com/bingo-oss/bui-weex

bui-weex-sample示例库 https://github.com/bingo-oss/bui-weex-sample

bui-weex-toolkit命令行工具 https://github.com/bingo-oss/bui-weex-toolkit

bui-weex-template脚手架工程 https://github.com/bingo-oss/bui-weex-template

欢迎大家给我们提 issue :https://github.com/bingo-oss/bui-weex/issues

感谢理解与支持!

阅读之前

在往下阅读开发文档之前,您需要具备如下技能:

技能一:熟悉 Weex 官方开发套路

官网 :http://weex-project.io/cn/

BUI-Weex 仅仅是在UI层面给予开发者提供脚手架以及丰富的组件,JS Module以及内置的功能,开发者需要在官网寻找答案。

技能二:熟悉 Vue2.0 语法

官网:https://cn.vuejs.org/ 另外阅读:【Vue 2.x 在 Weex 和 Web 中的差异】

Vue2.0 是前端领域炙手可热的 Javascript 框架,与 Weex 结合,使用Vue 作为上层框架,遵循 W3C 标准实现了统一的 JSEngine 和 DOM API。

技能三:了解 Webpack 用法

教程 :【Webpack简明教程】

Webpack是目前最流行的前端模块加载方案,在Webpack中,所有资源都被当作是模块,js,css,image 等。支持压缩合并替换等功能。作为前端er,可以不知道 gulp ,但错过了 Webpack 会很遗憾 !

技能四:SASS语法

官网:http://www.w3cplus.com/sassguide/syntax.html

Sass 扩展了 CSS3,增加了规则、变量、混入、选择器、继承等等特性。Sass 生成良好格式化的 CSS 代码,易于组织和维护。