- 语义锚定:新增大纲模式输入 (WriterPanel.vue, appStore.js) - 风格对齐:实现参考案例风格提取与可视化 (DeepSeekAPI.js, appStore.js, WriterPanel.vue) - 认知模拟:引入深度模式 Agentic Workflow (Draft->Critique->Refine) - 优化 Prompt 构建:支持风格标签注入 (promptBuilder.js) - 更新文档:添加第一性原理功能说明 (README.md)
182 lines
5.0 KiB
Markdown
182 lines
5.0 KiB
Markdown
# 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. 流式输出增强 (Stream Optimization)
|
||
项目在 `DeepSeekAPI.js` 中实现了稳健的 SSE (Server-Sent Events) 解析器:
|
||
- **逐行扫描**:放弃简单的 `split` 分割,改用逐字符缓冲区扫描,确保处理被网络分包截断的 JSON 数据。
|
||
- **协议兼容**:完美支持标准 SSE 协议,兼容 data: 后有无空格的各种情况。
|
||
- **状态管理**:通过 `appStore` 统一管理生成状态,实现组件间的数据实时同步,保证 UI 渲染无延迟。
|
||
|
||
### 2. 状态管理重构
|
||
- **逻辑收拢**:将所有 API 调用和业务逻辑(生成、分析)移入 Pinia Store (`appStore.js`)。
|
||
- **组件纯粹化**:`WriterPanel` 和 `AnalysisPanel` 仅负责 UI 渲染和用户交互,不再包含核心业务逻辑。
|
||
|
||
### 3. 深度集成
|
||
- **应用到写作**:实现了从"范式分析"到"写作工坊"的深度数据迁移,包括原文引用、风格约束注入和范式模板自动匹配。
|
||
|
||
## 核心功能升级:写作第一性原理
|
||
|
||
本项目已基于写作的"第一性原理"进行了深度重构,旨在解决 AI 写作的本质矛盾:
|
||
|
||
### 1. 语义锚定 (Semantic Anchoring) - 解决"写什么"
|
||
- **大纲模式 (Outline Mode)**:提供结构化输入(核心主题、目标受众、关键观点),强制用户提供逻辑骨架,有效防止 AI 幻觉和跑题。
|
||
- **原理**:通过高确定性的逻辑约束(Logic)来引导 AI 的概率采样,实现熵减。
|
||
|
||
### 2. 风格对齐 (Style Alignment) - 解决"怎么写"
|
||
- **风格显性化**:自动分析参考案例,提取关键风格标签(如 #短句为主 #语气犀利),并在 UI 中可视化展示。
|
||
- **向量特征注入**:将提取的风格标签作为显性特征注入 Prompt,强迫 AI 输出向参考案例的向量空间偏移。
|
||
|
||
### 3. 认知模拟 (Cognition Simulation) - 解决"深度"
|
||
- **深度模式 (Deep Mode)**:引入 Agentic Workflow(智能体工作流),模拟人类"初稿 -> 批判 -> 润色"的思维链。
|
||
- **过程可视化**:在界面上实时展示 AI 的"反思"(Critique)和"修正"(Refine)过程,用计算换质量。
|
||
|
||
## 功能特性
|
||
|
||
### 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
|