前些日子試了下vscode配合docker容器開發(fā),體驗(yàn)特別不錯,比敲docker命令舒爽多了。在這里和大家分享一下。
安裝插件
首先你的機(jī)器上安裝好docker和vscode兩個(gè)基本軟件并啟動它倆,這里就不多說了。接下來我們正式進(jìn)入主題:
在vscode的擴(kuò)展欄中搜索:Remote或者Containers,找到Remote - Containers
這個(gè)插件,并且安裝好,如圖:
[圖片上傳失敗...(image-ad7b2f-1587736231054)]
項(xiàng)目配置構(gòu)建
這里拿世界上最好的語言php來做個(gè)示范,使用git拉取微軟官方提供的一個(gè)例子:
git clone https://github.com/microsoft/vscode-remote-try-php.git
接下來我們使用vscode打開這個(gè)項(xiàng)目,我們可以看到這樣的目錄結(jié)構(gòu):
.
├── .devcontainer
│ ├── Dockerfile
│ └── devcontainer.json
├── .vscode
│ └── launch.json
└── index.php
我們可以看到一個(gè)熟悉的Dockerfile
, 大概看看它的內(nèi)容:
FROM php:7-cli
# Avoid warnings by switching to noninteractive
ENV DEBIAN_FRONTEND=noninteractive
# This Dockerfile adds a non-root user with sudo access. Use the "remoteUser"
# property in devcontainer.json to use it. On Linux, the container user's GID/UIDs
# will be updated to match your local UID/GID (when using the dockerFile property).
# See https://aka.ms/vscode-remote/containers/non-root-user for details.
ARG USERNAME=vscode # vscode用戶
ARG USER_UID=1000
ARG USER_GID=$USER_UID
RUN sed -i 's/security.debian.org/mirrors.aliyun.com/g' /etc/apt/sources.list \
&& sed -i 's/deb.debian.org/mirrors.aliyun.com/g' /etc/apt/sources.list
# Configure apt and install packages
RUN apt-get update \
&& apt-get -y install --no-install-recommends apt-utils dialog 2>&1 \
#
# install git iproute2, procps, lsb-release (useful for CLI installs)
&& apt-get -y install git openssh-client less iproute2 procps iproute2 lsb-release \
#
# Install xdebug 安裝了xdebug
&& yes | pecl install xdebug \
&& echo "zend_extension=$(find /usr/local/lib/php/extensions/ -name xdebug.so)" > /usr/local/etc/php/conf.d/xdebug.ini \
&& echo "xdebug.remote_enable=on" >> /usr/local/etc/php/conf.d/xdebug.ini \
&& echo "xdebug.remote_autostart=on" >> /usr/local/etc/php/conf.d/xdebug.ini \
#
# Create a non-root user to use if preferred - see https://aka.ms/vscode-remote/containers/non-root-user.
&& groupadd --gid $USER_GID $USERNAME \
&& useradd -s /bin/bash --uid $USER_UID --gid $USER_GID -m $USERNAME \
# [Optional] Add sudo support for the non-root user
&& apt-get install -y sudo \
&& echo $USERNAME ALL=\(root\) NOPASSWD:ALL > /etc/sudoers.d/$USERNAME\ # 把vscode這個(gè)用戶授權(quán)sodo
&& chmod 0440 /etc/sudoers.d/$USERNAME \
#
# Clean up
&& apt-get autoremove -y \
&& apt-get clean -y \
&& rm -rf /var/lib/apt/lists/*
# Switch back to dialog for any ad-hoc use of apt-get
ENV DEBIAN_FRONTEND=dialog
這是一個(gè)基于php:7-cli
的php環(huán)境并且裝了xdebug
擴(kuò)展,再添加了一個(gè)名叫vscode
的用戶并授權(quán)sudo。
考慮到我們的網(wǎng)絡(luò)問題,我們使用aliyun的鏡像地址來加速構(gòu)建。在上面的Dockerfile中加了兩行:
RUN sed -i 's/security.debian.org/mirrors.aliyun.com/g' /etc/apt/sources.list \
&& sed -i 's/deb.debian.org/mirrors.aliyun.com/g' /etc/apt/sources.list
啟動
完事具備,開始運(yùn)行它:
按F1
然后選擇Remote-Containers: Open Repository in Container
。或者點(diǎn)左下角的圖標(biāo):
[圖片上傳失敗...(image-5e84b8-1587736231055)]
因?yàn)楦鼡Q了源,幾分鐘時(shí)間就構(gòu)建好。
運(yùn)行成功之后,你可以發(fā)現(xiàn),開發(fā)流程和本地開發(fā)幾乎一摸一樣。我們打開vscode下的terminal終端,可以看到命令提示符:
vscode@0d2acb021651:/workspaces/vscode-remote-try-php$
這個(gè)vscode用戶就是之前Dockerfile中定義的用戶。
接下來就完全當(dāng)本地開發(fā)吧。
添加端口
我們php開發(fā),大多是web開發(fā),我們在上面打開的終端中啟動一個(gè)web服務(wù):
php -S 0.0.0.0:8080
這時(shí)候需要映射一個(gè)端口到本地:
按F1
然后選擇Forward a port
,比如也輸入8080。在瀏覽器中打開127.0.0.1:8080就可以訪問我們的web服務(wù)。
我們還可以在啟動的時(shí)候讓它自動映射端口,我們在devcontainer.json
文件中加入:
// An array port numbers to forward
"forwardPorts": [8080],
是不是特別的方便~??????
最后想說的是:雖然現(xiàn)在vscode下開發(fā)php還不如phpstorm來的爽快,但是這種開發(fā)模式確實(shí)已經(jīng)超過了phpstorm。體驗(yàn)好,簡單還有例子,文檔也齊全。其他語言的例子也都有,大家可自己嘗試下。