Ionic2にCrosswalkを導入したときに遭遇したエラーのメモです。
https://crosswalk-project.org/
Intelで開発された、端末保有のWebViewに置きかわるWebViewコンポーネントです。
Crosswalkが登場した経緯として、古い端末のWebViewの問題が挙げられます。
というのも、WebViewはandroid4.3まではWebKitベース、android4.4ではChromiumベース、そしてandroid5からはシステムから切り離されてGooglePlayでアップデートができるようになりました。
つまり以前の端末ではバグやセキュリティホールが発見されても、端末メーカーがアップデートを行わないかぎり修正されません。
またWebAPIやCSSのサポートにも差がでるために、端末によっては表示が崩れたり、動作が正常でない場合もあります。
こうした問題を解消するために開発されたのがCrosswalk です。
実際にandroid4.3のGalaxy Nexusでテストしてみました。
こちらがcrosswalkを入れる前の画面です。
タブのテンプレートを使っているのですが、スタイルが崩れて見えるどころか全く見えません。真っ白のままです。
アプリサイズは4.10MBでした。
こちらが導入後の画面です。
ちゃんとタブやページ内容が見えるようになりました。
アプリサイズは77.29MBでした。
$ ionic start [アプリ名]
ionic2アプリを作成したい場合は –v2オプションが必要です。
このままでも動く(はず)なのですが、
こちらで取り上げられているエラーのため、androidのplatformを入れ直しました。
$ ionic platform rm android
$ ionic platform add https://github.com/apache/cordova-android
$ ionic plugin add cordova-plugin-crosswalk-webview
これだけで導入は終わりのはずなのですが…
エラー: XWalkWebViewEngineはabstractでなく、CordovaWebViewEngine内のabstractメソッドevaluateJavascript(String,ValueCallback<String>)をオーバーライドしません
public class XWalkWebViewEngine implements CordovaWebViewEngine {
^
ionic run androidするとこんなエラーが。
よく見るとプラグインのインストール時に警告文が出ていました。
Unmet project requirements for latest version of cordova-plugin-crosswalk-webview:
cordova-android (6.3.0-dev in project, >=6 required)
Fetching highest version of cordova-plugin-crosswalk-webview that this project supports: 1.8.0 (latest is 2.3.0)
platformを入れ直しているために最新版のCrosswalkプラグインがインストールできていなかった？ようなので、
$ ionic plugin rm cordova-plugin-crosswalk-webview ionic plugin
$ add cordova-plugin-crosswalk-webview@2.3.0
バージョン指定して入れ直しました。
なんとか無事に動くようになりました。
