摘要：从才开始支持，使用之前请确保版本正确。使用最初存在的目的就是为了方便大家打包和应用，是解决原生开发的一些问题的。运行至少得装和，建议使用，生成的安卓工程是基于的运行得用，依赖管理使用，再稍微配置一下即可。
开始之前系列文章的目录在 ? 这里
每个项目开始之前，都会先讲怎么搭环境，Weex 和 Vue 都讲了。其实一个框架推出之后，“怎么配置开发环境”这类文章会比较多，每个人写的都不一样，最好的方式是去看官方文档。我这里如果详细写的话，肯定和官方文档 80% 内容都一样。
《Weex 快速上手》
《Vue.js 介绍》
所以我就不讲怎么搭环境了！文章标题是骗人的！ ?
因为有现成的项目可以参考（weex-hackernews），可以直接“授之以鱼”。不过，我会根据不同的需求，帮你找到“授之以渔”的那些文章。
学习 Weex + Vue其实这些技巧与 Weex 和 Vue 都没多大关系的，在 日新月异 的前端环境里，学习怎么配“最先进”的开发环境是个绕不过的坎。我这里只讲与 Weex 和 Vue 有关的。
现在有机会在生产环境中使用 Weex + Vue 的应该寥寥无几，大家应该都是抱着一份好奇的心态想看看 Weex + Vue 能折腾出什么花样。
如果你只是想学习 Weex 和 Vue，那就不比大费周章的搭建什么 Android 、iOS 环境，直接在 dotwe.org 上写例子，使用 Weex Playground App 扫描二维码就可以查看页面了。Weex 从 0.9.5 才开始支持 Vue，使用之前请确保 SDK 版本正确。
用 Weex Playground App 扫描这个链接中的二维码可以获取 WeexSDK 的版本。（建议提 issue 之前都能提供环境信息）
除此之外，我还有一个仓库，weex-vue-examples，里边包含了各种单页的小例子，几乎涵盖了所有 Weex 组件、模块，也用到了很多 Vue 2.x 的特性。可以也可以直接将代码复制到 dotwe.org 上运行。
进一步学习 Weex + Vue如果你不满足于使用在线网站写代码，想在本地写一些更复杂的例子（有没有发现 dotwe 上没法写多文件的例子），很好，给你推荐两个工具：weex-toolkit 和 weex-pack。
为什么是两个工具？因为解决的问题不一样，目前这两个工具也正在考虑合并，把 weex-pack 合进 weex-toolkit，只保留 weex 命令。
同样，我也不写具体的使用方法了，各自的项目文档上都有，我讲一下这两个工具的特点和差别。
使用 weex-toolkit如果大家有详细的使用经验，欢迎贡献出来，精力有限，欢迎好心人帮我填坑。。。?
安装完 weex-toolkit 之后，它生成了 weex 命令，是个工具集，用法是 weex
初始化项目。
编译 .we 和 .vue 文件。
调试代码。
对我来说，用的最多的就是 调试代码。weex debug 可以会启动一个 server 并且弹开一个调试页面，上边有个二维码；用 Weex Playground App 扫描这个二维码就可以用 chrome 开发者工具调试真机了。
对于项目的初始化，大家可以用各自最喜欢的工具来搭，官方标配是 Webpack + weex-loader ，其他的，像启动本地服务、eslint、postcss、自动化测试这些东西都可以自行配置的，和其他标准的前端项目一样。
至于编译，还是建议使用 dotwe.org 或者本地配个工程编译源码，因为命令行工具更新慢，又比较难定制。
使用 weex-packweex-pack 最初存在的目的就是为了方便大家打包 Android 和 iOS 应用，是解决原生开发的一些问题的。它也能初始化项目，不过生成的项目里除了 Web 工程以外，还有 Android 和 iOS 。
虽然能够直接生成好 Android 和 iOS 工程，但是如果你机器上什么环境也没配，也是运行不起来的。
运行 Android 至少得装 java 和 Andorid SDK，建议使用 Android Studio，生成的安卓工程是基于 Android Studio 的；运行 iOS 得用 Mac，依赖管理使用 CocoaPods，再稍微配置一下 Xcode 即可。这方面的教程网上比较多了，我也不专业，我就不误人子弟了。
集成 WeexSDK其实你不是非得集成 WeexSDK 才能用真机看 Weex + Vue 的渲染效果的，有好几种方法：
下载 Weex Playground App，扫描 dotwe.org 中的例子。
使用 weexpack init [project-name] 初始化三端工程。
克隆 weex-hackernews，直接使用其中的 Andorid 和 iOS 工程。
能走到这一步的人都比较有耐心，相信你对 Weex 也有了比较全面的了解。官方也有文档教你怎么集成 WeexSDK ：
《集成 Weex 到已有应用》 （包含了 Android 和 iOS）
如果你想扩展 Weex 的组件和模块，也有相关文档可供参考：
《Android APIs》
《Android 扩展》
《iOS APIs》
《iOS 扩展》
在 weex-hackernews 这个项目里，我最初也是没有使用 weex-pack 这个工具，是一步一步用 Android Studio 和 Xcode 创建的项目，并且添加的原生初始化代码。（因为当时工具都还不支持 Vue，连 WeexSDK 都得手动基于仓库源码集成?）
参考 weex-hackernews 的两个 PR 查看初始化步骤和代码：Andorid 、 iOS。
文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。
转载请注明本文地址：https://www.ucloud.cn/yun/16622.html
摘要：从才开始支持，使用之前请确保版本正确。使用最初存在的目的就是为了方便大家打包和应用，是解决原生开发的一些问题的。运行至少得装和，建议使用，生成的安卓工程是基于的运行得用，依赖管理使用，再稍微配置一下即可。 系列文章的目录在 ? 这里 开始之前 每个项目开始之前，都会先讲怎么搭环境，Weex 和 Vue 都讲了。其实一个框架推出之后，怎么配置开发环境这类文章会比较多，每个人写的都不一样，...
摘要：不区分事件的捕获阶段和冒泡阶段，相当于级事件。默认是组件级别的作用域，没有全局样式。不支持样式继承因为有作用域隔离。 系列文章的目录在 ? 这里 在配置完开发环境之后，就可以开始写应用了。在写应用之前，肯定会先划分好页面，一个一个独立着写的。 不过，首先要明确的是，使用 Weex 写出来的是原生应用，页面的概念还和 Web 上一样吗？ Weex 里页面的概念 写的有些乱，与下边内容关系...
摘要：不区分事件的捕获阶段和冒泡阶段，相当于级事件。默认是组件级别的作用域，没有全局样式。不支持样式继承因为有作用域隔离。 系列文章的目录在 ? 这里 在配置完开发环境之后，就可以开始写应用了。在写应用之前，肯定会先划分好页面，一个一个独立着写的。 不过，首先要明确的是，使用 Weex 写出来的是原生应用，页面的概念还和 Web 上一样吗？ Weex 里页面的概念 写的有些乱，与下边内容关系...
摘要：使用值来作路由。原生应用本身就是多页的场景，页面间状态的隔离比共享更重要一些。使用开发的是原生应用，页面栈的管理使用的也是原生的特性，没有但是有模块可以实现页面的前进和后退等操作。 系列文章的目录在 ? 这里 （由于 我比较懒 最近一段时间在忙其他事，系列文章拖了好久终于又更新了。。。） 什么是 vue-router ？ vue-router 官方文档 vue-router 是针对 V...
摘要：如果你尚不了解，并想简单入门，可以阅读整理快速入门笔记网易严选感受开发什么都不说，先给你感受下的效果。此处对寄有厚望单位中的所有属性值的单位均为，也可省略不写，系统会默认为单位。 showImg(https://segmentfault.com/img/remote/1460000012869672); 自打出生的那一天起，Weex 就免不了被拿来同 React Native「一决高下...
阅读 2746·2021-10-19 10:09
阅读 2917·2021-10-09 09:41
阅读 3274·2021-09-30 09:46
阅读 3144·2021-09-26 09:47
阅读 2375·2019-08-30 15:56
阅读 459·2019-08-29 17:04
阅读 1364·2019-08-27 14:19
阅读 873·2019-08-26 11:58
