手把手提高開發體驗:dev-container

山頭人漢波發表於2022-12-28

之前看過方應杭的一期工作流影片,講他是如何配置開發環境的。講真,這期影片給我一絲震撼,原來不用虛擬機器也能在 linux 上開發,但是它的配置過於複雜,我想配置一套自己的一套開發環境

影片中的 remote-container 已經更名為 dev-container,而 0.245.2 以上版本的 dev-container 有問題,會報"An error occured setting up the container - Remote Docker",在 Issues 中有人給出了方法是降級到 0.245.2

當降級到 0.245.2,就可以愉快的使用 dev-container 了

現在我們已經成功了 dev-container 外掛

現在我們要做的是,透過 dockerfile 生成一個 linux 容器,並在這個容器中開發

小試牛刀

FROM centos:8

RUN uname -a

RUN cat /etc/os-release

我們基於 centos:8 來構建一個映象,其中,列印系統名和檢視系統

基於centos的映象

點選新增終端,就進入容器中了,這個容器就是我們基於 vscode 的 dev-container 外掛

vscode中的linux

如果只是個裸機,是萬萬不行的,我們需要安裝一些開發環境和應用,提高我們的開發效率

更新所有包

在更新包之前,我們要先修改 centos 的映象源

RUN cd /etc/yum.repos.d/
RUN sed -i 's/mirrorlist/#mirrorlist/g' /etc/yum.repos.d/CentOS-*
RUN sed -i 's|#baseurl=http://mirror.centos.org|baseurl=http://vault.centos.org|g' /etc/yum.repos.d/CentOS-*

修改成國內的映象,再更新包

RUN yum update -y

下載 vim

先下載 vim

RUN yum install vim -y

如何配置,怎麼配置 vim,介於還處於新手階段,就常規操作即可,不用配置什麼

下載 oh-my-zsh

如果冒冒失用它官網的下載連結,會報錯

RUN sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"
# curl: (7) Failed to connect to raw.githubusercontent.com port 443: Connection refused

意思是說 Github 的 raw.githubusercontent.com域名解析汙染,訪問不了

解決方法有不少,如透過修改hosts解決此問題,先在 ipaddress查詢raw.githubusercontent.com的真實IP,在修改 hosts

vim /etc/hosts

新增199.232.68.133 raw.githubusercontent.com

image-20221211111537132

重新下載 zsh

sh -c "$(curl -fsSL https://raw.github.com/ohmyzsh/ohmyzsh/master/tools/install.sh)"

image-20221211111627534

這方法只能在 linux 中使用,如果你要用 dockerfile 中修改 /etc/hosts,就行不通,因為 /etc/hosts 檔案是隻讀的,筆者在這裡花了不少時間想解決,但還是沒找到解決方法

還有一種方法是修改下載源,換成國內地址

sh -c "$(curl -fsSL https://gitee.com/mirrors/oh-my-zsh/raw/master/tools/install.sh)"

並將預設命令列修改成 on-my-zsh

RUN chsh -s /bin/zsh

但這個方法需要兩個前提,一是需要下載 git

RUN yum install git -y

二是因為 centos 8 系統中並未帶 chsh 命令工具,會提示 chsh: command not found,原因是系統沒有自帶的 util-linux-user 工具包導致,所以在執行 chsh 命令前,先安裝它

RUN yum install util-linux-user -y

如此,我們就配置好了一個基於 centos 的有 vim、on-my-zsh 的 linux 環境

完整的 dockerfile 如下所示:

FROM centos:8

RUN uname -a

RUN cat /etc/os-release

# 修改映象源
RUN cd /etc/yum.repos.d/
RUN sed -i 's/mirrorlist/#mirrorlist/g' /etc/yum.repos.d/CentOS-*
RUN sed -i 's|#baseurl=http://mirror.centos.org|baseurl=http://vault.centos.org|g' /etc/yum.repos.d/CentOS-*

# 更新系統
RUN yum update -y

# vim
RUN yum install vim -y

# chsh
RUN yum install util-linux-user -y

# git
RUN yum install git -y

# oh-my-zsh
RUN yum install zsh -y
RUN sh -c "$(curl -fsSL https://gitee.com/mirrors/oh-my-zsh/raw/master/tools/install.sh)"

RUN chsh -s /bin/zsh

關有這些不夠,還要下載前端環境、如 node 、pnpm,還有後端環境,筆者最近也對 ruby 很感興趣,也會在這裡安裝 ruby 環境

前端環境

我們採用 nvm 來控制 node 版本

安裝 nvm 的方式有很多種,像方應杭是下載原始碼,再複製到容器中,如果沒有網路限制,也可以用 curl 下載等等,我採用的是 git install

ENV NVM_DIR /root/.nvm
RUN git clone https://github.com/nvm-sh/nvm.git /root/.nvm/
# RUN git checkout v0.39.3
RUN sh ${NVM_DIR}/nvm.sh &&\
    echo '' >> /root/.zshrc &&\
    echo 'export NVM_DIR="$HOME/.nvm"' >> /root/.zshrc &&\
    echo '[ -s "${NVM_DIR}/nvm.sh" ] && { source "${NVM_DIR}/nvm.sh" }' >> /root/.zshrc &&\
    echo '[ -s "${NVM_DIR}/bash_completion" ] && { source "${NVM_DIR}/bash_completion" } ' >> /root/.zshrc

再透過 nvm 下載最新版本的 node

RUN nvm install stable

但是這樣會報錯,說 nvm: command not found,為什麼這樣,不求甚解,去找另一種解決方法

筆者選擇先安裝個預設版本的 node 和 npm,按照這裡的包管理安裝

RUN dnf module install nodejs:16
預設dnf module install nodejs 會安裝 v10版本,太低了,最高16,選新不選久

再下載 pnpm ,將其設為包管理器

RUN curl -fsSL https://get.pnpm.io/install.sh | sh -

如此一來,前端的開發環境以及 node 環境就再這個 dockerfile 中了

ruby 環境

我找的教程是這個,日本人做的,內容很齊全,按照步驟,能執行好環境

RUN dnf module install ruby:3.0 -y
RUN gem sources --add https://gems.ruby-china.com/ --remove https://rubygems.org/
RUN curl https://dl.yarnpkg.com/rpm/yarn.repo > /etc/yum.repos.d/yarn.repo
RUN dnf -y install ruby-devel rpm-build make gcc gcc-c++ gcc-gdb-plugin libxml2 libxml2-devel mariadb-devel zlib-devel libxslt-devel
RUN gem install nokogiri -- --use-system-libraries
RUN gem install rails --version="~>7.0"

如此一來,我們的開發環境就初步弄好了,我將它釋出到 dockerhub 上,如果有需要,可以以此改造

總結

這篇文章花了我不少時間,主要很多 linux 知識點為涉獵過,之前也沒在虛擬機器上配置 linux 的經驗。不過還好,算完成了,如此一來,開發時就可以用 vscode + linux 開發應用了,剩下的就是熟悉它

參考資料

相關文章