Docker を使用して開発環境を構築する方法 (Windows および Mac)

# 国内のミラーステーションを設定します。これは国内の操作を高速化するために使用されます。これはオプションです。$ sudo pacman-mirrors -i -c China -m rank

# Pacmanを使用してDockerをインストールする
$ sudo pacman -S docker

# docker ユーザー グループを作成します。デフォルトでは、docker コマンドは Unix ソケットを使用して Docker エンジンと通信します。 Docker エンジンの Unix ソケットにアクセスできるのは、root ユーザーと docker グループ内のユーザーのみです。セキュリティ上の理由から、通常、Linux システムでは root ユーザーは直接使用されません。したがって、より良い方法は、docker を使用する必要があるユーザーを docker ユーザー グループに追加することです。
$ sudo グループ追加 docker

# 現在のユーザーを docker グループに追加します。変更は、現在のターミナルからログアウトして再度ログインした後に有効になります。$ sudo usermod -aG docker $USER

# インストールが成功したかどうかをテストする $ docker run --rm hello-world

$ winget をインストール Docker.DockerDesktop

$ brew install --cask docker

$ docker --version

$ vi /etc/docker/deamon.json

# 入力ミラーソース {
  # 1 つのソースのみを変更し、配列の代わりに文字列を直接使用することもできます。
  「レジストリミラー」: [
    「https://registry.docker-cn.com」、
    "http://hub-mirror.c.163.com",
    「https://docker.mirrors.ustc.edu.cn」
  ]、
}

# :wq 保存して終了し、dockerを再起動します
$ systemctl dockerを再起動します

{
    「レジストリミラー」: [
        「https://registry.docker-cn.com」、
        "http://hub-mirror.c.163.com",
        「https://docker.mirrors.ustc.edu.cn」
    ]、
    }

# フロントエンド開発ではシェルコマンドが必要になることが多く、比較的充実した環境の方が重要なので、Ubuntuをベースとして選択しています。コンテナのサイズを気にする場合は、Ubuntuから適切な基本イメージを選択できます。
ラベル org.opencontainers.image.authors="[email protected]"

# 環境変数 ENV DEBIAN_FRONTEND 非対話型を設定します

# タイムゾーンを設定 ARG TZ=Asia/Shanghai
ENV TZ ${TZ}

実行 ln -snf /usr/share/zoneinfo/$TZ /etc/localtime && echo $TZ > /etc/timezone

# USER rootを操作するにはrootユーザーを使用する

# 中国でのプロセスを高速化するために Alibaba Cloud ソースを変更する RUN sed -i "s/security.ubuntu.com/mirrors.aliyun.com/" /etc/apt/sources.list && \
    sed -i "s/archive.ubuntu.com/mirrors.aliyun.com/" /etc/apt/sources.list && \
    sed -i "s/security-cdn.ubuntu.com/mirrors.aliyun.com/" /etc/apt/sources.list
apt-get cleanを実行する

# ソースを更新し、対応するツールをインストールします。 RUN apt-get update && apt-get install -y \
    zsh \
    ヴィム\
    wget \
    カール\
    パイソン \
    gitコア

# 後でコンテナに入るときにシェルをより便利に使用できるように、zshをインストールします
git clone https://github.com/robbyrussell/oh-my-zsh.git ~/.oh-my-zsh && \ を実行します。
    cp ~/.oh-my-zsh/templates/zshrc.zsh-template ~/.zshrc && \
    git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions && \
    git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting && \
    sed -i 's/^plugins=(/plugins=(zsh-autosuggestions zsh-syntax-highlighting z /' ~/.zshrc && \
    chsh -s /bin/zsh

# me ユーザーを作成 RUN useradd --create-home --no-log-init --shell /bin/zsh -G sudo me && \
    adduser me sudo && \
    'me:password' をエコー | chpasswd

# omz をインストールしてください
ユーザー私
git clone https://github.com/robbyrussell/oh-my-zsh.git ~/.oh-my-zsh && \ を実行します。
    cp ~/.oh-my-zsh/templates/zshrc.zsh-template ~/.zshrc && \
    git clone https://github.com/zsh-users/zsh-autosuggestions ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-autosuggestions && \
    git clone https://github.com/zsh-users/zsh-syntax-highlighting.git ${ZSH_CUSTOM:-~/.oh-my-zsh/custom}/plugins/zsh-syntax-highlighting && \
    sed -i 's/^plugins=(/plugins=(zsh-autosuggestions zsh-syntax-highlighting z /' ~/.zshrc

# nvmとnodeをインストールする
環境変数 NVM_DIR=/home/me/.nvm \
    ノードバージョン=v14

mkdir -p $NVM_DIR && \ を実行します。
    curl -o- https://gitee.com/mirrors/nvm/raw/master/install.sh | bash && \
    . $NVM_DIR/nvm.sh && \
    nvm インストール ${NODE_VERSION} && \
    nvm ${NODE_VERSION} && \ を使用します
    nvm エイリアス ${NODE_VERSION} && \
    ln -s `npm bin --global` /home/me/.node-bin && \
    npm インストール --global nrm && \
    nrm タオバオを使用 && \
    エコー '' >> ~/.zshrc && \
    echo 'export NVM_DIR="$HOME/.nvm"' >> ~/.zshrc && \
    echo '[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # これでnvmがロードされます' >> ~/.zshrc

# 糸をインストールする
curl -o- -L https://yarnpkg.com/install.sh | bash; を実行します。\
    エコー '' >> ~/.zshrc && \
    echo 'export PATH="$HOME/.yarn/bin:$PATH"' >> ~/.zshrc

# NVMバイナリをルートの.bashrcに追加します
ユーザー ルート

実行 echo '' >> ~/.zshrc && \
    echo 'export NVM_DIR="/home/me/.nvm"' >> ~/.zshrc && \
    echo '[ -s "$NVM_DIR/nvm.sh" ] && . "$NVM_DIR/nvm.sh" # これでnvmがロードされます' >> ~/.zshrc && \
    エコー '' >> ~/.zshrc && \
    echo 'export YARN_DIR="/home/me/.yarn"' >> ~/.zshrc && \
    echo 'export PATH="$YARN_DIR/bin:$PATH"' >> ~/.zshrc

# ノードとYARNのPATHを追加する
環境変数 PATH $PATH:/home/me/.node-bin:/home/me/.yarn/bin

# 最終的なイメージサイズを減らすためにapt/listsを削除します。RUN rm -rf /var/lib/apt/lists/*

ワークディレクトリ /var/www
Dockerfile を記述したら、ビルドします。

ビルドは docker -t frontend/react:v1 です。
ビルド後、直接実行できます:

# 私として実行します。推奨方法: docker run --user=me -it frontend/react:v1 /bin/zsh

# ルートとして実行 docker run -it frontend/react:v1 /bin/zsh

バージョン: '2'
サービス:
    反応:
    建てる：
        コンテクスト： 。
        dockerfile: react/Dockerfile
    端末: 真
    ポート:
        - 30000:3000
    ボリューム:
        - ./react/www:/var/www
    ネットワーク:
        -フロントエンド
    マイスク:
    イメージ:mysql:5.7
    ポート:
        - 33060:3306
    ボリューム:
        - ./mysql/データ:/var/lib/mysql
        ./mysql/docker-entrypoint-initdb.d:/docker-entrypoint-initdb.d を参照してください
    環境：
        -MYSQL_ROOT_PASSWORD=パスワード
    ネットワーク:
        -フロントエンド

#コンテナを同じネットワークに配置し、コンテナ名を介してネットワークに直接アクセスします。
    フロントエンド：
    ドライバー: ブリッジ

# docker-compose.yml があるディレクトリを入力します $ cd frontend

# docker-compose.yml 内のすべてのコンテナをバックグラウンドで起動します。コンテナがビルドされていない場合は、最初にビルドされます。$ docker-compose up -d

# コマンドラインインタラクションのために react コンテナに入る $ docker-compose exec --user=me react /bin/zsh

// インデックス.js
定数mysql = require('mysql')
const接続 = mysql.createConnection({
    ホスト: 'mysql',
    ユーザー: 'root'、
    パスワード: 'パスワード',
    データベース: 'テスト',
})

接続。接続();

connection.query(`SELECT * FROM users`, 関数 (エラー, 結果, フィールド) {
    if (エラー) エラーをスローします。
    console.log(結果)
})

接続を終了します。

$ ノードindex.js
[ RowDataPacket { id: 1, name: 'Caster' } ]