66
Help us understand the problem. What are the problem?

posted at

updated at

Docker上にvue.jsの開発環境を構築する方法。docker-composeで簡単に作成する手順。

Docker上にvue.jsの開発環境を構築する方法。docker-composeで簡単に作成する手順。

dockerを使ってvue.jsの開発環境を簡単に構築できるようにする。

本番に応用できるよう、DockerfileのENTRYPOINTでコンテナ内のスクリプトを実行する。

また、実行はdocker-composeを使用する。
実行順序は docker-composeファイル -> Dockerファイル -> スクリプトファイル となる。

複数人のプロジェクトを想定して、作成したファイル群をgithubにアップして、cloneしvue.jsの開発環境を立ち上げるまで。


開発手順

  1. Dcokerのインストール
  2. Dockerfileの作成
  3. シェルスクリプトの作成
  4. docker-compose.ymlの作成
  5. .dockerignoreの作成
  6. aliasの作成
  7. aliasファイルの読み込み
  8. docker-composeの実行
  9. コンテナ内に入る
  10. vueの開発環境を作成する
  11. ファイルの移動と削除
  12. vue開発環境の確認
  13. githubに作成したファイル群をプッシュ
  14. 他のプロジェクトメンバーのローカルで実行する


Dcokerのインストール

Dockerの公式ページからOSに合ったDockerをインストール

設定が完了したら、正しくインストールされているかターミナルで確認。

$docker -v
Docker version 19.03.12

$docker-compose -v
docker-compose version 1.26.2

dockerとdocker-composeのバージョンがそれぞれ表示されたらOK。





この記事はこちらに移転しました。

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Sign upLogin
66
Help us understand the problem. What are the problem?