背景
在前端或 Node.js 开发过程中,开发者经常需要管理大量的项目文件夹。频繁地在各个目录间切换、手动打开终端执行 node app.js、再手动打开浏览器输入 localhost:端口,以及定期备份代码到优盘,这些重复性劳动降低了开发效率。为了解决这些痛点,我们使用 Python 和 wxPython 图形库开发了一款集"项目管理、一键联动运行、自动化备份"于一体的桌面工具。
C:\pythoncode\new\folder_manager_tool.py
目标
- 持久化管理:使用 SQLite 数据库记录项目路径、描述及个性化配置。
- 可视化交互:点击项目列表即时预览文件结构,支持截图备注。
- 自动化流控:一键运行 Node.js 脚本,并根据配置自动唤起 Chrome 浏览器。
- 智能备份:一键将选中的文件打包压缩至指定备份路径(如优盘或特定磁盘)。
方法
- GUI 框架 :
wxPython(提供丰富的原生桌面控件)。 - 数据存储 :
sqlite3(轻量级、无需配置的本地数据库)。 - 进程控制 :
subprocess(用于调用系统命令行执行 Node.js 和启动 Chrome)。 - 文件处理 :
os、shutil、zipfile(处理路径扫描与压缩)。
过程:核心功能实现深度解析
1. 点击项目展示文件结构
这是程序最基础的交互逻辑。通过绑定 wx.EVT_LIST_ITEM_SELECTED 事件,当用户点击左侧项目列表时,触发路径扫描。
技术实现:
- 路径获取:从选中的 ListItem 中提取物理路径。
- 排序算法 :使用
os.listdir获取内容,并通过sorted(items, key=lambda e: (not os.path.isdir(...)))确保文件夹始终排列在文件上方。 - 状态恢复 :从数据库查询该路径上次运行的
last_js文件名,并在渲染列表时利用self.file_list.Select(idx)自动高亮。
2. 自动化压缩至"优盘"(智能备份路径)
程序预设了备份根目录(如 D:\nodejs程序集,可代表优盘挂载点)。
核心代码分析:
python
def on_smart_zip(self, event):
# 1. 获取当前文件夹名并创建备份子目录
folder_name = os.path.basename(self.current_folder)
target_dir = os.path.join(r"D:\nodejs程序集", folder_name)
if not os.path.exists(target_dir): os.makedirs(target_dir)
# 2. 遍历右侧 Checkbox 选中的文件
with zipfile.ZipFile(zip_path, 'w', zipfile.ZIP_DEFLATED) as z:
for item in checked:
full_path = os.path.join(self.current_folder, item)
# 3. 如果是文件夹则递归压缩,文件则直接写入
if os.path.isfile(full_path):
z.write(full_path, item)
else:
for root, _, files in os.walk(full_path):
for f in files:
fp = os.path.join(root, f)
z.write(fp, os.path.relpath(fp, self.current_folder))
该功能的精髓在于使用 os.walk 进行递归扫描,确保选中的子文件夹及其内部成千上万个文件能被完整地封装进 ZIP 包。
3. 一键运行 Node.js 指令
这是提高生产力的核心。通过 subprocess 模块,我们不再需要手动打开 cmd。
关键点:
- 环境隔离 :使用
cwd=self.current_folder参数,确保 Node.js 在正确的目录下运行,避免路径找不到的问题。 - 控制台驻留 :指令中使用
/k参数(start cmd /k "node xxx.js"),这样即使 Node.js 报错退出,控制台窗口也会保持开启状态,方便开发者查看错误日志。
4. Chrome 联动与独立端口
每个 Node.js 项目通常占用不同的端口(如 3000, 8080)。我们在数据库中为每个路径维护了一个 port 字段。
实现流程:
- 实时保存 :监听端口文本框的
EVT_TEXT事件,用户输入的瞬间即保存至数据库。 - 联动判断 :在运行 Node.js 的函数末尾,检查
auto_chrome_cb是否勾选。 - 精准唤起:
python
url = f"http://localhost:{self.port_ctrl.GetValue()}"
subprocess.Popen([CHROME_PATH, url])
通过直接调用 Chrome 的绝对路径并传入 URL,实现"运行即打开"的无缝体验。
结果
通过上述逻辑,我们成功构建了一个三栏式的管理台:
- 左栏:项目收藏夹,记录了数十个项目的路径与描述。
- 中栏 :文件浏览器,不仅能看,还能勾选需要备份的模块(跳过巨大的
node_modules文件夹)。 - 右栏:详情控制台,支持粘贴运行截图作为封面,并实时配置端口。
