暂无图片
暂无图片
暂无图片
暂无图片
暂无图片

Weex 介绍

ChangbaDev 2018-09-21
1338

Weex是一个使用Web开发体验来开发高性能原生应用的框架。

Weex 致力于使开发者能基于当代先进的 Web 开发技术,使用同一套代码来构建 Android、iOS 和 Web 应用。具体来讲,在集成了 WeexSDK 之后,你可以使用 JavaScript 和现代流行的前端框架来开发移动应用。

Weex 的结构是解耦的,渲染引擎与语法层是分开的,也不依赖任何特定的前端框架,目前主要支持 Vue.js 和 Rax 这两个前端框架。

Weex 的另一个主要目标是跟进当代先进的 Web 开发和原生开发的技术,使生产力和性能共存。在开发 Weex 页面就像开发普通网页一样;在渲染 Weex 页面时和渲染原生页面一样。

一次编写,处处运行

Weex 可以只编写一份代码,开发出三端都可用的页面。

在多个端中使用相同的源代码可以显著提高开发效率,并简化测试,构建和发布流程。在此基础上,Weex 可以将前端的打包、测试流程与手机端监控、发布系统结合起来,提高开发效率。

原生组件与原生模块

组件可理解为视图,模块可理解为提供的能力。

Weex 内置二十余种原生组件和原生模块。在移动端,weex 页面实际使用原生组件渲染,因此可提供媲美原生代码的性能。原生模块可以提供移动平台 native 级别的能力,如位置、陀螺仪等。除了内置的原生组件及原生模块,也可以很容易的扩展并集成更多的原生组件与模块,复用已有的 native 代码。

下面将对 Weex 的开发环境进行一步步的介绍,以便大家快速上手。

开发环境安装过程

安装 Homebrew

/usr/bin/ruby -e "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/master/install)"

安装 Node.js

brew install node@8

安装 weex-toolkit

npm install -g weex-toolkit@latest

强烈建议不要使用淘宝源,否则 npm5 以上很可能安装失败。

创建首个 weex 应用

创建新工程

weexpack create YourAwesomeProject

cd YourAwesomeProject

npm i

参照官方例子,编辑页面文件 src/index.vue

预览页面

weex preview src--entry src/index.vue

此时 weex-previewer 将打开一个本地服务器,页面中出现二维码;使用淘宝、钉钉、唱吧等集成了 weex 的应用扫码即可预览。

附:目前稳定的开发环境版本

node -v

v8.11.3


npm -v

4.6.1 (使用淘宝源)

6.4.1 (使用官方源)


weex -v

v1.3.8

- weexpack : v0.4.7-beta.20

- weex-builder : v0.4.0

- weex-previewer : v1.5.1


weexpack -V

1.2.6


weex-debugger -v

1.1.12


Reference

  • https://weex.incubator.apache.org/cn/guide/set-up-env.html

  • https://github.com/weexteam/weex-toolkit/blob/master/README-zh.md


文章转载自ChangbaDev,如果涉嫌侵权,请发送邮件至:contact@modb.pro进行举报,并提供相关证据,一经查实,墨天轮将立刻删除相关内容。

评论