Angular7 in Docker
Docker for Windows(Docker Community Edition for Windows)をWindows 10 PCへインストールしたので、試しにAngular7をコンテナ内でビルドし、実行してみます。
1.Dockerfile を書いてみる
Node.jsがインストール済みのイメージファイルをベースにして、Angular CLIのインストールと新規プロジェクトの作成をすればよいので・・・こんな感じかな?
FROM node:10-alpine WORKDIR /work RUN npm install -g @angular/cli@7.0.3 RUN ng new --defaults angular7 WORKDIR /work/angular7 CMD ng serve
2.ビルド&実行
作った Dockerfile を使って ng new
まで実行したイメージファイルを作り、実行してみる。
$ docker build -t angular7 . $ docker run -p 4200:4200 --name angular7 angular7
上手くいったようだが・・・http://locahost:4200 を叩いてもアクセスできず。結局、いろいろ試したところ、DockerfileのCMD行を
CMD ng serve --host `hostname`
へ変更して再度ビルド&実行すると、ホストPC上のブラウザからは http://127.0.0.1:4200 でアクセスできることが判明。Docker for Windows 固有の問題なのだろうか・・・?とりあえず動いたから良しとしよう^^;
3.Yarn 発見
ふと気づいたのだが・・・
$ docker exec -i -t angular7 /bin/sh /work/angular7 # yarn -v 1.10.1 /work/angular7 # which yarn /usr/local/bin/yarn
Ultra Fastを謳う^^; Yarnコマンド(現時点の最新Stable版)が/usr/local/binにインストールされていた。早速、Dockerfileを書き換えてみる。
FROM node:10-alpine WORKDIR /work RUN yarn global add @angular/cli@7.0.3 RUN ng new --defaults --skipInstall=true angular7 WORKDIR /work/angular7 RUN yarn CMD ng serve --host `hostname`
こんな使い方では速度を体感することもなく・・・動いたので良しとしよう^^;;