# AI 写作工坊 - 模块化版本 一个基于 Vue 3 + Vite 的专业 AI 写作辅助工具,支持结构化内容生成和写作范式分析。 ## 技术栈 - **框架**: Vue 3 (Composition API) - **构建工具**: Vite - **状态管理**: Pinia - **HTTP 客户端**: Axios - **Markdown 解析**: Marked - **样式**: Tailwind CSS ## 项目结构 ``` src/ ├── components/ # Vue 组件 │ ├── WriterPanel.vue # 写作面板 │ ├── AnalysisPanel.vue # 范式分析面板 │ └── MainContent.vue # 主内容区 ├── stores/ # Pinia 状态管理 │ └── app.js # 应用主状态 ├── api/ # API 接口 │ └── deepseek.js # DeepSeek API 封装 ├── utils/ # 工具函数 │ └── promptBuilder.js # Prompt 构建器 ├── App.vue # 根组件 └── main.js # 入口文件 ``` ## 功能特性 ### 1. AI 写作工坊 - 自定义写作任务输入 - 参考案例管理 - 输出规范标签系统 - 实时流式内容生成 - Prompt 调试预览 ### 2. 写作范式分析 - 预设写作范式库 - 文章智能分析 - 结构化结果展示 ### 3. 配置管理 - API 地址配置 - API Key 管理 - 支持多种中继平台 ## 快速开始 ### 安装依赖 ```bash npm install ``` ### 开发模式 ```bash npm run dev ``` ### 构建生产版本 ```bash npm run build ``` ### 预览生产版本 ```bash npm run preview ``` ## 配置说明 ### 环境变量配置 1. 复制环境变量示例文件: ```bash cp .env.example .env ``` 2. 编辑 `.env` 文件,配置您的 API 信息: ```env # DeepSeek API 配置 VITE_API_URL=https://api.deepseek.com/chat/completions VITE_API_KEY=your_actual_api_key_here ``` ### 支持的模型 - deepseek-chat(默认) - 可扩展支持其他兼容 OpenAI 格式的模型 ### 安全提示 - `.env` 文件已添加到 `.gitignore`,不会被提交到版本控制 - 生产环境请使用服务器环境变量或密钥管理服务 ## 开发指南 ### 添加新的写作范式 在 `src/components/AnalysisPanel.vue` 中的 `paradigms` 数组添加新范式: ```javascript { type: 'new-type', name: '新范式名称', icon: '🎯', description: '描述信息', tags: ['标签1', '标签2'], tagClass: 'bg-color-900/30 text-color-300' } ``` ### 扩展 API 支持 在 `src/api/` 目录下创建新的 API 类,继承基础接口: ```javascript import BaseAPI from './base.js' export default class NewAPI extends BaseAPI { // 实现具体方法 } ``` ### 自定义 Prompt 模板 在 `src/utils/promptBuilder.js` 中修改 `buildPrompt` 函数: ```javascript export const buildPrompt = (task, constraints, references) => { // 自定义构建逻辑 } ``` ## 部署建议 ### 静态部署 - Vercel - Netlify - GitHub Pages ### 服务器部署 - Nginx + PM2 - Docker 容器化 - CDN 加速 ## 许可证 MIT License