Agent Skills
返回列表
Flask Vue 项目生成器

Flask Vue 项目生成器

开发编程 更新于 2026.08.29

将以下提示词粘贴到你的 AI 对话框中：

请根据 https://skillhub.cn/install/skillhub.md，安装 @user_246d1f61/flask-vue-project-creator 到你的 AI 助手中。

技能介绍

解决全栈脚手架的繁琐与同质化

在开发 Flask + Vue.js 全栈应用时，工程师往往需要花费大量时间手动拼凑项目结构、配置依赖管理工具以及编写重复的日志初始化代码。更棘手的是，由 AI 辅助生成的前端界面极易陷入“AI 模板化”的陷阱，充斥着千篇一律的字体、白紫渐变和 Emoji 图标，缺乏产品级的设计质感。

核心架构与工作流

该技能通过标准化的自动化流程解决上述痛点。它采用单端口架构，让 Flask 在 80 端口统一接管所有请求，包括通过路由动态分发 templates/ 目录下的静态资源，从而省去了前后端分离部署的复杂度。

  • 依赖与日志：项目初始化时自动生成基于 uv 的 pyproject.toml 配置，并内置基于 TimedRotatingFileHandler 的结构化日志模块。日志按天轮转，保留 30 天，同时输出到控制台和 src/log/ 目录。
  • 前端设计规范：严格遵循“反 AI 模板化”原则。强制使用独特的 Google Fonts 组合、上下文相关的色彩系统，并仅允许使用 SVG 图标。Vue.js 通过 CDN 引入并搭配 Composition API 模式。
  • 文档同步：在修改任何路由、模块或配置后，技能会自动同步 AGENTS.md 文档，确保项目结构树、架构描述和 Changelog 始终与实际代码状态保持一致。

适用边界与注意事项

该技能专为追求快速交付且前端交互相对轻量的场景设计。由于采用单端口架构和 Vue CDN 加载模式，它不适合需要复杂状态管理的大型单页应用（SPA），也不适用于要求前后端独立扩展或部署的微服务架构。此外，前端设计规范高度依赖特定的字体和色彩约束，若项目已有既定的视觉设计系统，需谨慎评估其适配成本。

使用场景

  • 搭建内部管理后台 MVP，需要 Flask 提供 API 并在同一端口渲染 Vue 前端页面，不想处理跨域和多端口部署的复杂度。
  • 为后端服务配置统一日志方案，需要按天轮转文件、保留 30 天并同时输出到控制台，不想手写 logging 配置。
  • 制作个人作品集或小型 SaaS 前端界面，希望避开 AI 生成常见的白紫渐变和默认字体，获得有设计感的页面。
  • 在项目结构变更后维护 AI Agent 协作文档，需要 AGENTS.md 自动同步路由、模块和变更记录，不想每次手动更新。

适合人员

  • 独立全栈开发者，需要快速搭建项目骨架并保持前端设计质量，不想在脚手架配置上耗费过多时间。
  • 后端工程师，需要为新项目接入结构化日志和 uv 依赖管理，希望减少重复的环境搭建工作。
  • AI 辅助开发实践者，在使用 AI 生成项目时希望避开模板化的前端风格，获得有辨识度的界面。
  • 小团队技术负责人，需要为团队项目建立统一的初始化规范和文档同步机制，保证项目结构一致。