HTMLをアプリにしてみる(Cordova)

3339 ワード
HTML5 Cordova HTML5 テキストリンク

HTMLをアプリにしてくるものがあるらしい

  • HTMLをアプリに変換してくれるツールがあるらしい。
  • CordovaというものでApacheファミリーらしい。

ということで、インストールしてHelloWorldのapk実行までをやってみた。

Cordovaをインストール

前提となるもの

  • node
  • npm

node

個人的にはWindowsだったら、nodist。macだったら、nodebrewで入れておくのがおすすめ。
（今回はWindowsでやってます）

$ node --version
v11.13.0

$ npm --version
6.9.0

これができたら、npmでCordovaをインストールしてみる。

$ npm install -g cordova

インストールできたらCordovaコマンドを確認

$ cordova -version
9.0.0 ([email protected])

まずはブラウザモードでHelloWorld

プロジェクトを作るディレクトリに移動して、プロジェクトを作る
（cdで、作るディレクトに移動しておいてください。今回は d:\var\labo\CordovaHello）

cd \var\labo
cordova create CordovaHello

できたら、ビルドしてみる。
今回はブラウザ版

cordova build browser

できたら、実行する。
ブラウザでCordovaのページが開いたら成功

$ cordova run browser
startPage = index.html
Static file server running @ http://localhost:8000/index.html
CTRL + C to shut down
200 /index.html (gzip)
200 /css/index.css (gzip)
200 /js/index.js (gzip)
200 /cordova.js (gzip)
200 /img/logo.png
200 /cordova_plugins.js
200 /favicon.ico (gzip)

Androidビルド環境をつくる

必要なもの

それぞれインストール
- Android Stdio
- JDK

Windowsだと%JAVA_HOME%と%PATH%の設定確認
version確認しておくこと。

$ java -version
java version "1.8.0_221"
Java(TM) SE Runtime Environment (build 1.8.0_221-b11)
Java HotSpot(TM) 64-Bit Server VM (build 25.221-b11, mixed mode)

このあとビルドコマンドを打つのだが、JDKやAndroid studioの状況によりエラーがでたりする。
遭遇したのは
- Android SDK Build-tools は19以上が必要
- Android API 28がみつからない
とでたので、Android SDK Managerでポチポチと入れた。

$ cordova build android
Checking Java JDK and Android SDK versions
ANDROID_SDK_ROOT=undefined (recommended setting)
ANDROID_HOME=\Android\android-sdk (DEPRECATED)
Subproject Path: CordovaLib
Subproject Path: app

（中略）

BUILD SUCCESSFUL in XX
XX actionable tasks: XX up-to-date
Built the following apk(s):
        $ d:\var\labo\CordovaHello\platforms\android\app\build\outputs\apk\debug\app-debug.apk

これで、成功。
あとは、このapkをエミュレータなり、実機にインストールすればOK。

次回は、リンクタグで内外のサイトを行き来させてみる（たぶん）

工場モード--これを見れば十分です
Gitlabプライベートウェア構成アクセスアドレス