手軽にIonicをdockerで動かしてさわってみる

手軽にIonicをdockerで動かしてさわってみたいときのためのメモ。

Dockerfileを用意してあげるとIonicが起動できました。手抜きでAndroid SDKはいれてないので、Cordovaによるスマホアプリ作成はできません。Webアプリだけになります。ただ、Ionicを手軽に試してみたいなら、これで充分。(2018-03-05 macOSだと動かないのと、Linuxでもuid 1001のユーザーだと動かないのでDockerfileとdocker buildコマンドの引数を修正。)

FROM node:8.9.4-alpine

ARG HOST_USER_ID=1000
ARG HOST_GROUP_ID=1000
ARG USER_NAME="node"
ARG USER_EMAIL="node@localhost.localdomain"

WORKDIR /usr/src/app

RUN apk update && \
    apk add -q shadow && \
    apk add -q git && \
    groupmod -g ${HOST_GROUP_ID} node && \
    usermod -u ${HOST_USER_ID} node && \
    npm i -g --unsafe-perm cordova --no-progress && \
    npm i -g --unsafe-perm ionic --no-progress && \
    su - node -c "git  config --global user.name $USER_NAME" && \
    su - node -c "git  config --global user.email $USER_EMAIL" && \
    su - node -c "ionic --no-interactive config set -g daemon.updates false"

Alpineをベースとしているのでイメージの容量が小さくて済んでいます。シェルはbashではなくshなので注意。
ここでは「-u」でユーザーID, グループIDを指定することで生成されるファイルの所有者がrootにならないようにしています(dockerコマンドを実行するユーザーのユーザーID、グループIDを指定するために”$(id -u $USER):$(id -g $USER)”を指定してます)。macOSではHOST_GROUP_ID=$(id -g $USER)の行は必要ないようです。

$ docker build \
   --build-arg HOST_GROUP_ID=$(id -g $USER) \
   --build-arg HOST_USER_ID=$(id -u $USER) \
   --build-arg USER_NAME=user001 \
   --build-arg USER_EMAIL="user001@example.jp" \
   -t sssg/ionic .
$ docker run -it -p 8100:8100 \
   -u $(id -u $USER):$(id -g $USER) \
   -v ${PWD}:/usr/src/app \
   -w /usr/src/app --name ionic-app001 --rm sssg/ionic sh

Dockerコンテナのシェルに入ったら、ionic startでアプリを作って、serveで起動。

$ ionic start app001 blank
$ cd app001/
$ ionic serve

http://localhost:8100/ でIonicアプリにアクセスができます。http://localhost:8100/ionic-lab を開くとAndroid, iOSの画面イメージも確認できます。

同じタグの記事: Docker
同じタグの記事: Ionic
同じカテゴリの記事: Linux