React開発環境をDockerでサクッと構築
2410 ワード
Dockerfile
FROM ubuntu:latest
RUN apt-get update && apt-get install -y curl
RUN curl -sL https://deb.nodesource.com/setup_12.x | bash
RUN apt-get install -y nodejs
RUN curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | apt-key add && echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list && apt update && apt install -y yarn
ENTRYPOINT [ "/bin/bash"]
WORKDIR /react-sample
上のDockerfileがあるディレクトリで以下のコマンドを実行します。
docker build . -t react/ubuntu:latest
これでreact開発に必要なyarnとnode.jsをインストールしたイメージを作成できました。
image名はreact/ubuntu:latestと付けています。
reactアプリを作成
create-react-appを使ってサンプルプロジェクトを作成してみます。
create-react-appをインストールして、react-sampleという名前のプロジェクトを作成するために以下のコマンドを実行します。
yarn global add create-react-app
create-react-app react-sample
dockerコンテナ
先ほど作成したdockerイメージとサンプルプロジェクトを使って、dockerコンテナを作成します。
docker run -p 3000:3000 -v /[ホストのパス]/react-sample:/react-sample -it react/ubuntu:latest
localhost:3000でプロジェクトにアクセスするために -pでポートフォワーディング、-vでプロジェクトをコンテナ内にマウントしています。
あとは以下のコマンドを実行すればアプリを起動できます。
yarn
yarn start
参考になれば幸いです！
Author And Source
この問題について(React開発環境をDockerでサクッと構築), 我々は、より多くの情報をここで見つけました https://qiita.com/Tak-Iwamoto/items/0eca0bf678be0dd570e5著者帰属：元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .