在使用docker-compose运行的环境中,添加开发容器并使用vscode进行开发(不使用devcontainer.json文件作为策略)
那就是什么意思呢?
好的。我知道你說的有點難懂。
為了解釋清楚,我試著用圖解來說明。
首先,我们将当前的开发环境设定为以下环境。

通过执行 “docker-compose up -d” 命令,启动下列容器。
-
- Nginx
-
- forntend
-
- backend
- DB
每个容器都连接到Docker网络,因此可以进行通信。
前端和后端好像都挂载了主机端源文件目录并在其上运行。
嗯,我认为这是常见的结构。
我们的目标是在此基础上加入一个用于后端开发的容器,并在其中进行开发。

可以使用现有的后端,但既然有机会就最好单独设置一个环境,使其更整洁!
如果要简洁地概括的话
-
- 開発用のコンテナを作る
-
- vscode からコンテナに attach
- Let’s 開発!
所以
在试用环境中,我们将使用FastAPI提供的“Full Stack FastAPI PostgreSQL”模板。然而,在撰写本文章的阶段,该模板已停止维护,需要进行一些修改才能运行。有关更多信息,请参阅下面的文章。
那么,使用docker-compose up -d命令来启动容器集合。
$ docker-compose ps
Name Command State Ports
--------------------------------------------------------------------------------------------------------------
full-stack-fastapi- /start-reload.sh Up 80/tcp, 0.0.0.0:8888->8888/tcp,::
postgresql_backend_1 :8888->8888/tcp
full-stack-fastapi- bash /worker-start.sh Up
postgresql_celeryworker_1
full-stack-fastapi- docker-entrypoint.sh postgres Up 5432/tcp
postgresql_db_1
full-stack-fastapi- flower --broker=amqp://gue ... Up 0.0.0.0:5555->5555/tcp,:::5555->5
postgresql_flower_1 555/tcp
full-stack-fastapi- nginx -g daemon off; Up 80/tcp
postgresql_frontend_1
full-stack-fastapi- /entrypoint.sh Up 443/tcp, 0.0.0.0:5050->5050/tcp,:
postgresql_pgadmin_1 ::5050->5050/tcp, 80/tcp
full-stack-fastapi- /entrypoint.sh --providers ... Up 0.0.0.0:80->80/tcp,:::80->80/tcp,
postgresql_proxy_1 0.0.0.0:8090->8080/tcp,:::8090->8
080/tcp
full-stack-fastapi- docker-entrypoint.sh rabbi ... Up 15691/tcp, 15692/tcp, 25672/tcp,
postgresql_queue_1 4369/tcp, 5671/tcp, 5672/tcp
首先,在这里添加一个用于开发的容器。
类似于命名并运行它。
请根据您的要求更改为 fastapi-backend-dev 部分。
docker-compose run --name fastapi-backend-dev backend
所以,当容器启动后,请将其停止。
接下来,我们将通过VSCode的远程探测器连接到创建的容器中。
在远程探测器中应该可以看到之前创建的容器的名称。
(关于VSCode的扩展功能,就不详细说明了,请参考相关文档。)

如果有容器的话,可以右键点击->在新窗口中附加到容器。
如果您正在使用“Full Stack FastAPI PostgreSQL”模板,那么请打开/app作为工作目录。
之后应该是和正常的开发一样的……应该是这样的。
在pytest中试着进行调试。
让我们使用VSCode在pytest中进行调试。
首先是先前的資訊。
在 “Full Stack FastAPI PostgreSQL” 模板的後端環境中,Python 3.9 和 3.7 是共存的。
在backend.dockerfile中有一些记录,但是根据环境要求,我们将在vscode中将python引用设置为3.7版本。

接下来就请你自己处理吧。
打开 app/tests/crud/test_item.py 以及其他文件,用 pytest 进行调试吧。

同时清理和格式化同时进行,lint和保存
我会尝试同时对文件进行整理和保存时进行格式化,来记录文件。
首先,让我们添加下述的扩展功能。
-
- ms-python.black-formatter
- ms-python.isort
接下来,在.vscode/settings.json文件中追加以下内容。
{
+ "editor.formatOnSave": true,
+ "python.linting.enabled": true,
+ "python.linting.flake8Enabled": true,
+ "python.linting.mypyEnabled": true,
+ "[python]": {
+ "editor.defaultFormatter": "ms-python.black-formatter",
+ "editor.codeActionsOnSave": {
+ "source.organizeImports": true
+ },
+ },
+ "black-formatter.args": [
+ "--config",
+ "pyproject.toml"
+ ],
+ "isort.args": [
+ "--settings-file",
+ "pyproject.toml"
+ ],
}
如果持有者这样做的话。。

尽管在gif中很难理解,但在 = 标记处插入了大量的空格后进行保存。
结果就是它会回到初始状态。
太棒了!
需要注意的是,在主机端将添加 .vscode/settings.json 文件,因此请确保将其忽略不要误提交。
不足之处
一个缺点是,如果重新创建容器,那么 VSCode 的扩展程序等将会被重置,需要重新安装。
如果使用devcontainer.json,能自動化這些事情嗎呢。。。
以上!辛苦了!