weex run android 编译失败问题排查

项目是使用 weex create 创建的 webpack 项目。目的是测试 vue router 使用。

首先

npm run build

以生成 index.weex.js。但是运行

weex run android

发现编译出来的居然仍然是旧的 Hello World 演示程序

依旧是 Hello World

Now, let’s use vue to build your weex app.

通过关键字排查

grep "use vue to build" -r .

./platforms/android/app/src/main/assets/dist/views/index.js:      }, [_vm._v("Now, let's use vue to build your weex app.")])])
./platforms/android/app/src/main/assets/dist/router.js:   }, [_vm._v("Now, let's use vue to build your weex app.")])])
./platforms/android/app/src/main/assets/dist/entry.js:    }, [_vm._v("Now, let's use vue to build your weex app.")])])
./platforms/android/app/src/main/assets/dist/index.js:
./.weex_tmp/index.js:     }, [_vm._v("Now, let's use vue to build your weex app.")])])
./.weex_tmp/index.weex.js:        }, [_vm._v("Now, let's use vue to build your weex app.")])])
./src/.weex_tmp/index.js:         }, [_vm._v("Now, let's use vue to build your weex app.")])])
./src/.weex_tmp/index.weex.js:    }, [_vm._v("Now, let's use vue to build your weex app.")])])
./dist/views/index.js:    }, [_vm._v("Now, let's use vue to build your weex app.")])])
./dist/router.js:         }, [_vm._v("Now, let's use vue to build your weex app.")])])
./dist/entry.js:          }, [_vm._v("Now, let's use vue to build your weex app.")])])

清理缓存的废弃文件，重新编译

rm -Rf .weex_tmp
rm -Rf dist
npm run build
weex run android 

依旧是 Hello world， 继续清理

rm -Rf src/.weex_tmp
rm -Rf platforms/android
weex platform add android
weex run android

终于不是 Hello world 啦，但是一直转菊花 。。。

根本看不到任何的错误信息，编译也没有报错 （后来发现只是 weex 没有报错罢了）

决定使用 android studio 打开 android 项目目录，进行编译

Error Loading Project: Cannot load 4 modules

null java.nio.BufferOverflowException

具体的错误信息可以在 Android Monitor 中看到

06-13 09:38:01.687 30912-30912/com.alibaba.weex E/weex: java.io.FileNotFoundException: dist/index.js
at android.content.res.AssetManager.openAsset(Native Method)

查看 package.json，参考 weex hacknews， 在 scripts 中增加

"copy:android": "cp dist/index.weex.js platforms/android/app/src/main/assets/dist/index.js"

执行

npm run copy:android

android studio - build - clean project

重新在 android studio 中编译，终于可以看到我的界面啦。。。

总结

• 缓存问题，用 grep 排查最有效
  
• 运行时报错，用 android studio 排查具体原因
  
• weex 的 platforms 目录也应该加入 git 代码管理，需要当成独立的原生项目对待

关于作者 🌱

我是来自山东烟台的一名开发者，有感兴趣的话题，或者软件开发需求，欢迎加微信 zhongwei 聊聊，或者关注我的个人公众号“大象工具”， 查看更多联系方式