---

一个简易的可运行Python程序的Web IDE
由项目https://github.com/vimior/PythonWebIDE学习而来，Vue3 + Python3.10 + Tornado6.1实现
可前后端分离，重构方向Vite + Vue3 + Python3.10 + FastAPI

• 支持工程、文件、文件夹的增删查改
• 支持Python代码基本补全
• 支持Python代码运行管理和输出
• 支持Markdown文件的编辑和预览

准备nodejs和python3.10环境

• Node: 20.12.1
• Python: 3.10

安装yarn包管理

npm install --global yarn

安装poetry管理python项目的环境和依赖

pip install poetry

使用poetry创建虚拟环境

# 进入server目录
cd server

poetry env use python3.10

# 查看当前项目激活环境
poetry env list

开发时，python想获取正确补全提示需指定虚拟环境解释器路径

虚拟环境所在路径一般在~/.cache/pypoetry/virtualenvs目录下

如解释器路径/root/.cache/pypoetry/virtualenvs/pyide-e2Kx_ySG-py3.10/bin/python

回到项目根目录，安装前后端所有依赖

yarn install-all

开发环境调试前，在server目录下新建.env.dev文件，内容示例：

PYIDE_SERVER_ADDRESS=0.0.0.0
PYIDE_SERVER_PORT=21006
PYIDE_WEBSERVER_PATH=../.web-server
PYIDE_FRONTEND_PATH=../dist
PYIDE_IDE_PATH=../.webide-server/projects/ide
PYIDE_SDK_PATH=../.webide-server/projects/sdk
PYIDE_PYTHON_PATH=python3

运行

# 生成前端打包后的dist文件夹
yarn build

# 启动后端服务
yarn dev-server

访问

# 设置workspace参数，访问设定PYIDE_IDE_PATH目录下的指定文件夹，比如apps是apps文件夹，device是device文件夹，以下示例访问了test文件夹
http://localhost:21006/editor?workspace=test

打包相关指令看下文

开发环境

yarn build

yarn dev-server

yarn dev

# 生产环境预览
yarn build-all
yarn preview-after-build

生产环境

yarn build-all

# 打成tar包
yarn package-tar

命令行运行·，示例：

./pyide

• 布局，可拖拽调节网格之间比例
• 状态管理从Vuex迁移至Pinia，wsStore，ideStore
• ProjTree绑定文件目录，切换文件
• CodeTabs切换文件
• 代码编辑器读取文件内容
• 代码编辑器写入文件
• 文件树图标、tab栏图标
• 在终端运行代码(命令行式)
• 一键运行
• 多程序运行监控管理
• 文件、文件夹创建删除重命名等操作
• 新建工作区
• 上传文件
• markdown编辑器
• 只读文件提示
• 终端交互，仅支持后端部署在Linux

• 构建FastAPI总体框架
• 迁移部分接口
• 重构终端websocket连接
• 任务管理相关api
• 脚本输出捕获
• debug程序接口
• 只读文件获取

cd ./PyIDE
poetry shell
poetry lock
poetry install

sudo apt-get install -y python3-pip
sudo python3 -m pip install uv -i https://pypi.tuna.tsinghua.edu.cn/simple
uv lock
uv sync
source ./.venv/bin/activate
sudo -E env PATH=${PATH} python3 -m main

docker  build --platform linux/amd64 -t pyide-builder:latest --load .