使用Weex开发android应用

年初就已规划要在项目中使用weex,主要是有两上目的,一是提高一些简单页面的开发效率,二是可以快速发布一些功能,但因为种种原因这个事耽搁到现在也没有推动下去。快到年尾了,再不落实下这个事情,今年估计就没戏了,求人不如求已,先自己来研究一下,把坑踩完,再安排下去,应该会进行得快点。

准备工作

三军未动,粮草先行,准备工作应该要做好,安装好开发工具:

1. nodejs

安装好后,我还再安装一个cnpm: npm install -g cnpm --registry=https://registry.npm.taobao.org

2. 安装Weex开发工具: cnpm install -g weex-toolkit / weex install weexpack

工具安装完成后,就可以开始开发了

开发

1.创建项目 

weex create hello-weex

2. 安装依赖包

cd hello-weex/ && cnpm install

3. 运行

npm run dev 

npm run serve

如果出现错误: ERROR in index.web.js from UglifyJs, 看这里

最好看下这个里: Weex踩坑

项目正常运行起来后,通过http://localhost:8080 即可看到 weex h5 页面。

npm run build 之后, dist目录下会生成index.web.js和index.js 这两个分别对应web和app,在集成后android/ios中的远程js bundle时,用不带.web 这个js

集成到android,看官方教程,我这里是直接集成了服务端地址

图1

集成完成之后,运行anroid程序,就可以看到刚才的例子页面

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 2016年4月21日,阿里巴巴在Qcon大会上宣布开源跨平台移动开发工具Weex,Weex能够完美兼顾性能与动态性...
    晴天咚咚阅读 7,901评论 1 15
  • 本文作者 Jinkey(微信公众号 jinkey-love,官网 https://jinkey.ai)原文链接 h...
    JinkeyAI阅读 425,822评论 152 921
  • 如何搭建本地开发环境进行 Weex 开发。 使用Homebrew 进行安装 node;通常,安装了 Node.js...
    kakukeme阅读 5,252评论 0 50
  • 生活将我的棱角抹去,任由摆布。我将生活交于时间,愿时间待我温柔些…前半夜睡得如猪,后半夜醒的跟狗似的!
    傅村妞周周阅读 1,059评论 0 0
  • 效果如图: 点击录音进度条开始,再次点击暂停,会在暂停的地方有一个白色的断点。先说说大概的思路,进度条的xml文件...
    撕裂的我阅读 8,409评论 1 1