使用 Gradle 实现自动打包 (Weex)

随着 Weex、React Native 这些框架性能的进步,现在越来越多移动端项目会选择使用这类框架去进行混合开发,再提高效率的同时也不会使得性能有太大的问题.我们今天讲讲在集成这些框架到 Android Native 项目中时如何提高我们的工作效率.框架我们就不介绍了,可以自行了解:

• Weex
• React Native

1. 打包篇

在将 Weex 集成到 Android 项目中的时候,因为 Weex SDK 需要加载的是 JSBundle 文件,所以我们得在编写完 Weex 项目后,执行npm run build,然后再将生成在 dist 文件夹内的 *.js 文件拷贝到 Android 项目的 assets 文件夹下然后再打包 Android 项目才能生成一个正常集成的 Android App,于是我们在这里引入 Gradle 来解决我们的效率问题

1. 在项目根目录下创建 weex.sh

   1 2 3 4 5

   #!/bin/sh # 进入 weex 项目目录,假设是在根目录下 weex 文件夹 cd ./weex # 编译 Weex 项目完成后删除不需要的 web 文件并将生成的 js 文件复制到 assets npm run build && rm dist/*.web.js && cp dist/*.js ../app/src/main/assets/

2. 编辑 App module 根目录下的 build.gradle 添加如下:

   1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20

   ··· afterEvaluate { // 遍历打包版本 android.applicationVariants.all { variant -> // 便利打包版本输出 variant.outputs.each { output -> def outputFile = output.outputFile // 创建任务 def weexTask = tasks.create(name: "weex${variant.name.capitalize()}", description: "Get ${outputFile} with weex files ", group: "Weex", type: Exec) { workingDir '..' commandLine 'sh', 'weex.sh' } // 任务依赖 weexTask.dependsOn variant.assemble } } } ···

   这样在右侧的 Gradle Task 面板就会生成 weexDebug、weexRelease 这类的 task,点击即可运行上述脚本.(当然,点击 build 按钮的时候此任务也是会运行的)

搞定.收工!