Docker一键部署开发环境~带你逃离问题频出的环境部署

我搁这敲代码呢
3,041 阅读8分钟

Docker一键部署开发环境~带你逃离问题频出的环境部署

前言

个人开源的leno-admin后台管理项目，前端技术栈：reactHooks、ant-design；后端技术栈：koa、mysql、redis，整个项目包含web端、electron客户端、mob移动端、template基础模板，能够满足你快速开发一整套后台管理项目；如果你觉得不错，就为作者点个✨star✨吧，你的支持就是对我最大的鼓励；

演示地址

文档地址

源码github地址

在日常中我们是否有过，换一台电脑后，安装开发环境有时候都要折腾一两天，其中各种bug频出，让人直接沈升温；不过现在不用担心了，看了这篇文章后，以后你的电脑只用安装一个VScode和Docker Desktop（如果有条件租个云服务器，直接电脑连接到你的云服务器进行远程开发，电脑安装一个VScode，其他项目需要的所有配置文件全部放置到云服务器中，达到随时随地有电脑就可以开发程序的癫狂状态~🤸‍♀️）

一、安装Docker Desktop

首先你先要了解docker和linux的基础知识，如果没有相关知识的小伙伴可以先看以下的两篇文章简单学习下相关知识；

docker入门

linux入门

我个人是windows10系统，windows系统安装Docker Desktop需要修改电脑的一些设置项才能够运行；

Docker Desktop 官方下载

Docker Windows10安装Docker Desktop windows安装的看下这篇文章；

安装成功后，可以在电脑cmd中执行docker -v命令，检查docker是否安装成功，如果未安装成功，则安装docker；

image.png

二、用DockerFile和Docker Compose配置开发环境

我个人写了一个开源项目（gitee.com/zhao-wencha… 还在开发中，前端用的是reactHooks，后端用的是koa2、mysql、redis，所以我本篇文章写得是我个人项目的开发环境搭建，大家可以以此为参考自行搭建个人的项目开发环境镜像；

2-1、构建DokcerFile文件

我个人的开源项目需要用到了node，mysql，redis，git，其中我们可以拆分为三个镜像，分别是centos+node+git为一个主镜像（此镜像用于开发使用，可以运行前后端项目），mysql、redis分别单独为一个镜像，后期这两个上线的时候也可以通用；

2-1-1、构建主镜像

我的主项目，基础用的centos：7.9,是为了和我到时候上线时保持一致的环境，你也可以根据你个人的喜好选择基础环境；

FROM centos:7.9.2009

# 安装必要的软件包和依赖
RUN yum update -y && \
    yum install -y curl && \
    curl -sL https://rpm.nodesource.com/setup_14.x | bash - && \
    yum install -y nodejs git && \
    yum clean all && \
    rm -rf /var/cache/yum

RUN mkdir -p /home/devEnv

EXPOSE 9900

# /dev/null 保持一直运行，防止容器被停掉
CMD tail -f /dev/null

2-1-2、构建mysql镜像

我项目用的是mysql:8；我这里用的是bash命令进行构建的

docker run --name mysql8 --restart=always --privileged=true -e MYSQL_ROOT_PASSWORD="your password" -v /home/leno_admin/mysql/logs:/logs -v /home/leno_admin/mysql/data:/var/lib/mysql -v /home/leno_admin/mysqlData/leno_admin.sql:/docker-entrypoint-initdb.d/leno_admin.sql -p 3306:3306 -d mysql

2-1-3、构建redis镜像

# 拉取 docker-hub 里的redis 
docker pull redis

# 启动容器，并且设置密码和容器奔溃自启动
docker run -d --name redis --restart=always -p 6379:6379 redis redis-server --requirepass admin123

推荐可以将做好的镜像上传到云端，比如阿里云、腾讯云这些，我个人是将我的镜像存储到了阿里云的镜像仓库，后期使用docker-compose管理多个容器时，非常方便；

2-1-2、用docker-compose.yml配置开发环境管理文件

version: "1"

networks:
  app-leno-admin-dev-env:
    driver: bridge

services:
  mysql:
    image: registry.cn-shenzhen.aliyuncs.com/zwc-docker/leno_admin:mysql-8.0
    ports:
      - 4000:3306
    command: --default-authentication-plugin=mysql_native_password
    restart: always
    networks:
      - app-leno-admin-dev-env
    environment:
      - TZ=Asia/Guangzhou
      - MYSQL_ROOT_PASSWORD=your password
    volumes:
      - /home/leno_admin/mysql/data:/var/lib/mysql
      - /home/leno_admin/mysql/logs:/logs

  redis:
    image: registry.cn-shenzhen.aliyuncs.com/zwc-docker/leno_admin:redis-1.0
    ports:
      - 4100:6379
    networks:
      - app-leno-admin-dev-env
    environment:
      - TZ=Asia/Guangzhou
      - REDIS_PASSWORD=your password

  project-main:
    image: registry.cn-shenzhen.aliyuncs.com/zwc-docker/leno_admin:leno-admin-dev-1.0
    ports:
      - 9090:9090
    depends_on:
      - mysql
      - redis
    networks:
      - app-leno-admin-dev-env

我这里是从我的个人云镜像库拉取的镜像，当然你也可以配置从hub拉取镜像，本地抓取镜像都是可以的~

2-1-3、本地运行docker-compose.yml

配置好文件后，在docker-compose.yml的文件夹内进入到cmd，然后执行docker compose up -d命令运行docker-compose.yml文件；

下载好后，便可以查看你的docker desktop，可以看到有三个镜像，然后容器也已经启动了，项目基本的环境配置好了，接下来就是要如何让你的vscode连接进入容器内部，进行项目开发~

2-1-4、vscode安装连接的插件，并进入容器内

1、你需要在你的vscode中安装以下三个插件，三个插件可以连接并进入到docker容器内部，后面的远程连接也需要用到他们；

image.png

image.png

2、下载安装完成后，你的vscode左下角会出现一个绿色的图标，点击它

image.png

3、会出现以下的选项，点击Attach to Running Container

4、点击之后你就会发现出现的三个路径地址，其实就是你docker desktop上运行的三个容器，点击进入第一个，你开发的容器后，vscode就会重新打开一个窗口，这是加载会有点慢，耐心等待下~

5、加载成功后，左下角会显示你的容器与镜像名称，此时，你就打开终端，然后执行命令就行了，当前的系统环境是linux的，所以你需要执行的是linux命令，剩下的就和你的平时启动项目一样执行即可；

2-1-5、项目主容器内如何连接其他容器（mysql、redis）

下面是我在项目中配置的，在docker desktop环境下的开发配置；之前我们在docker-compose.yml中用docker compose配置了一个名为app-leno-admin-dev-env的局域网络，你的其他项目哦都可以用镜像构建的名称来进行连接；

但是我在连接的时候遇到了一个问题，就是我的mysql可以用我上面说的方法连接的上，但是我的redis却无法连接，于是我只好用host.docker.internal来进行连接（在Docker Desktop for Windows和Docker Desktop for Mac中，host.docker.internal被映射为宿主机的IP地址，可以用来访问宿主机上的服务），但是这种方法可以连接redis，用于连接mysql的时候又报了账号密码错误，但是我用了mysql管理工具，同样的账户和密码可以连接，真的比较奇怪（有知道如何解决的小伙伴，非常欢迎在评论区内告诉在下，感谢🙇‍）；

虽然出现了各种各样的问题，但是还是一一找到了替方法解决了，最终项目成功运行~

else if (process.env.NODE_ENV === 'docker-desktop') {
    return {
      // 服务器运行地址及端口
      APP_HOST: 'localhost',
      APP_PORT: 9090,
      APP_HTTP: 'http',
      // mysql
      MYSQL_HOST: 'mysql',
      MYSQL_PORT: 4000,
      MYSQL_USER: 'root',
      MYSQL_PWD: 'your password',
      MYSQL_DB: 'leno_admin',
      // JWT
      JWT_SECRET: 'lenoAdmin',
      JWT_REFRESH_SECRET: 'refreshToken',
      // redis
      REDIS_PORT: 4100,
      REDIS_HOST: 'host.docker.internal',
      REDIS_PASSWORD: 'your password',
      REDIS_DB: 0,
      // 图片路径
      IMG_URL: 'http://localhost:9090/static/'
    }
  }

以上完成后，虽然还无法做到一个VScode就能随时随地开发，因为这个还是需要寄生在Docker Desktop之上的，少年你知道充钱才能变强这个道理吗？搞个云服务器，把一切的环境部署到云服务器里，然后用VScode连接上你的云服务器，然后你懂的~~ 下面就开始讲，如何连接云服务器进行开发

三、连接云服务器进行项目开发

前面的那些镜像和容器操作，在云服务器上是一样的，所以这里就不浪费时间了，直接进入正题~

跟着我操作前，请确保安装了上一届的三个插件~

3-1、确保配置了SSH环境变量

远程开发的vscode 使用率ssh协议和远程服务端进行的通信，所以你需要先在你的本机上配置好ssh环境变量，git自带了ssh，所以如果安装了git并且配置了环境的话即可跳过这一步；

3-2、VS Code配置远程资源

1、点击如图所示

image.png

2、确保为SSH Targets后点击齿轮

image.png

3、点击第一个

4、点击后，会出现一个名为config的文件，第一次为空的，配置以下的东西

# 你的远程资源在VScode的资源管理的名称
Host leno-admin
  # 远程云服务器的ip
  HostName yourIp
  # 登录云服务器的彰化
  User root
  ForwardAgent yes

5、然后点击你刚刚配置好的服务器名称右边的新增窗口样式的icon

image.png

6、然后就会新打开一个vscode的窗口，第一次的时候会比较慢，请耐心等待，然后会出现一个让你输入密码的弹窗，将你刚刚配置的账户密码输入，然后就可以进入到服务器内了

7、点击进入你的项目文件夹，这是会第二次加载，还需要在输入一次密码，然后便进入了项目文件夹内，此时你便可以进行开发了~

image.png

image.png

3-3、配置免密登录

推荐一篇文章，按照该文章操作即可完成登录免密的配置

三步完成VSCode配置SSH免密登录远程开发

四、结语

docker在平时开发中也已经越来越普及，各位小伙伴学起来吧~，如果觉得文章对你有用，欢迎一键三联~✨

avatar
文章
阅读
粉丝