24第9章Weex简介（1-4节）课件.pptxVIP

第9章 ： 跨平台开发Weex 《Vue应用程序开发》 01 02 03 0 05 目 录 CONTENTS 9.1Weex简介和安装 9.1.1什么是Weex？ Weex （读音 /wiːks/，和Weeks同音）是使用流行的 Web 开发体验来开发高性能原生应用的框架。 Weex 致力于使开发者能基于通用跨平台的 Web 开发语言和开发经验，来构建 Android、iOS 和 Web 应用。简单来说，在集成了 WeexSDK 之后，你可以使用 JavaScript 语言和前端开发经验来开发移动应用。 Weex 的目标就是使用开发者基于一份代码，编写出可以运行在 iOS，Android 和 Web 上的应用，并最大化地提高开发效率和简化测试、构建、发布流程。 9.1.2Weex中的前端框架 Weex 应用需要依赖前端框架来编写，但 Weex 并没有绑定、限制在特定的框架上。目前 Vue和 Rax是最广泛应用于 Weex 开发的前端框架，也是目前功能最全、最稳定的方案。 9.1Weex简介和安装 Weex提供在线编辑器（http://editor.weex.io/），但如果你想更专业的开发 Weex，本章节会教你如何搭建本地开发环境进行 Weex 开发。 首先，请确保已经安装了node.js和npm。如果还没有安装，请参考7.1.1章节。 运行下面的命令安装最新的beta版本工具。 #OSX环境 $ sudo chmod -R 777 /usr/local/lib/node_modules/ $ npm i -g weex-toolkit // 安装不要使用sudo执行 $ weex -v // 查看当前weex工具版本 #Windows环境 $ npm i -g weex-toolkit $ weex -v // 查看当前weex工具版本 9.2创建一个新的App 下面我们将运用创建一个简单的Weex项目，详细说明从初始化到开发，再到编译和运行，最后到调试的过程。 9.2.1初始化 用 weex create 命令来创建一个空的模板项目。 weex create awesome-app 命令执行完以后，在当前目录的 awesome-app 文件夹里就有了一个空的 Weex + Vue项目。 9.2.2开发 进入刚刚创建的文件夹，并且安装依赖，然后执行 npm start。 9.2创建一个新的App 9.2.3编译和运行 默认情况下 weex create 命令并不初始化 iOS 和 Android 项目，你可以通过执行 weex platform add 来添加特定平台的项目。 9.3.4调试 weex-toolkit 提供了强大的调试功能，只需要执行下面的命令。 9.3Weex的生命周期 Vue生命周期函数 支持情况 说明 beforeCreate 支持 - created 支持 - beforeMount 支持 - mounted 支持 - beforeUpdate 支持 - updated 支持 - beforeDestroy 支持 - destroyed 支持 - errorCaptured 支持 在 Vue 2.5.0+，Weex SDK 0.18+中新增 9.4Vue在Weex中的不同 虽说WEEX使用Vue写的，但毕竟是需要在不同平台间运行的，虽然大部分语法都有支持，但是依然有部分语法是不同的。 9.5.1语法差异 9.5.2样式差异 感谢 聆听 THANK YOU FOR LISTENING