VSCode本地(远程)连接Docker进行代码编辑项目发布

废话一下:

起因:因为想装青龙面板玩玩,所以下载了Docker,安装完成青龙面板以后(安装docker和青龙面板过程踩的坑在这里《Windows安装Docker运行青龙面板总结》),想做个微信通知,在网上找了多个帖子后,发现必须要在青龙面板的scripts文件夹里面添加一个json配置文件,当使用2.10.X版本的青龙面板时,可以在Windows资源管理器里直接添加配置文件,但是当我想用更新版本的2.16.X的青龙面板时,发现新版的青龙面板安装文件不在我安装时候设置的文件路径里,我隐隐感觉不妙,然后我在scripts文件夹里建了一个test.json,果然在青龙面板里找不到这个文件(但是后来发现是因为新建完了没在docker里面重启青龙面板导致的),所以大费周章找了一圈,终于找到了办法:

一.软件版本:

docker : v4.23.0

青龙面板:正式版 v2.16.2

二.实现步骤

1.在vscode里安装docker插件

2.同样的方法安装Dev Containers

3.如果你的docker使用了wsl 2,那么有可能还需要装个wsl插件,自测。

4.运行docker启动青龙面板

5.vscode的搜索框点Show and Run Commands(或Ctrl+Shift+P)

然后点开发容器:附加到正在运行的容器

这时候就会显示出来你正在运行的项目

直接点击就会弹出新的界面,就可以愉快的写代码了,当然写完以后还得在原来的vscode的docker界面或者docker里重启项目才能完成更新,如果高手知道有什么办法可以实时更新,欢迎在评论区给出答案。

### 配置 VSCode 连接本地 Docker 容器 #### 插件安装 为了使 Visual Studio Code (VSCode) 能够连接本地运行的 Docker 容器,需先确保已安装两个必要的扩展:“Remote - SSH” 和 “Dev Containers”。这两个插件提供了通过SSH协议访问远程资源以及开发容器的支持功能[^2]。 #### 设置 Docker 环境变量 对于 Windows 用户,在使用 VSCode 连接基于 Ubuntu 的 Docker 容器前,应确认本机已经正确设置了 Docker 环境变量,并能够正常启动 Docker 服务。这通常意味着 Docker Desktop 已经被安装并且正在运行中。 #### 创建或选择合适的项目目录结构 建议创建一个新的工作区文件夹来放置即将用于调试的应用程序源码副本及其关联的 `.devcontainer` 文件夹。此`.devcontainer` 文件夹内应当包含定义好所需工具链和服务依赖关系的 `Dockerfile` 或者预构建镜像名称以及其他配置选项(比如端口转发设置等)。这些信息会被 Dev Containers 扩展用来初始化新的容器实例。 #### 编写 .devcontainer.json 文件 在一个典型的场景,开发者会在项目的根路径下建立名为 `.devcontainer/devcontainer.json` 的 JSON 格式的配置文档。该文件指定了要使用的基础镜像、附加软件包列表、环境变量声明等内容。下面是一个简单的例子: ```json { "name": "Node.js", "image": "mcr.microsoft.com/vscode/devcontainers/javascript-node:latest", "workspaceFolder": "/workspace" } ``` 这段代码片段表明将采用官方提供的 Node.js 开发环境作为底座,并指定 `/workspace` 为挂载点以便同步主机上的工程资料至容器内部。 #### 启动并连接容器 完成上述准备工作之后,只需打开命令面板 (`Ctrl+Shift+P`) 并执行 `Remote-Containers: Reopen Folder in Container` 命令即可让 IDE 自动拉取指定的基础镜像、应用自定义修改项进而开启交互式会话。此时应该可以在终端窗口看到由 VSCode 构建出来的临时容器的日志输出,与此同时编辑界面也会自动切换成针对新上下文优化过的视图模式。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值