EchoBlog

整理首屏资源

8%
EchoBlog
返回项目

Project Case Study

开发中 · 2025

CodePaper

在线代码片段与长文分享工具,兼顾阅读和整理。

阶段边界已提供可运行的本地优先写作原型,并用两篇正式技术长文验证安全预览、目录导航、草稿恢复、博客草稿导出和 Git 发布门禁;协作、自动发布与独立源码不在当前版本内。
演示地址 源码地址 · 尚未建立公开仓库
CodePaper

项目介绍

CodePaper 是一个面向代码片段、长文和技术笔记的写作工具。它试图解决“代码解释”和“文章叙述”之间来回切换的问题。

项目重点放在 Markdown 渲染、代码块可读性、片段管理和长文结构上,适合作为技术博客编辑器或个人知识整理工具。

Editor Sample

代码笔记编辑页示例

示例页把 Markdown 写作、代码片段和结构目录放在同一条工作流里,适合从零散片段整理成完整文章。

分屏

分屏编辑

左侧写作,右侧预览,保持文章结构和代码块可读。

  • 支持 Markdown 基础语法
  • 代码块显示语言与语法高亮
  • 目录随标题自动生成
片段

片段库

常用代码可以先作为片段保存,再插入到长文。

  • 按语言和标签筛选
  • 支持快速复制
  • 记录片段来源
导出

导出流程

把写好的技术笔记导出为便携 Markdown 或安全博客草稿。

  • 导出 Markdown
  • 生成完整 EchoBlog Frontmatter
  • 默认保持草稿和不可索引

目标与在建能力

以下内容包含正在实现和计划验证的能力,最终范围可能调整。

  • Markdown 长文编辑与实时预览
  • 浏览器本地草稿、自动保存和恢复
  • Markdown 文件导入、复制与导出
  • 完整 EchoBlog Frontmatter 的安全博客草稿导出
  • 危险 HTML 消毒和响应式编辑模式
  • 代码语言高亮、稳定标题锚点与当前章节目录

技术方案

编辑器

MarkdownCode HighlightKeyboard Flow

前端

Vue 3TypeScriptComposable Design

内容

Snippet ModelTag SearchExport Workflow

当前进展

区分已经形成的产物、尚未公开的版本和后续计划。

可运行原型
在 EchoBlog 中打开 CodePaper草稿仅保存在访问者当前浏览器
安全边界
Marked 解析、高亮前后均经 DOMPurify 消毒
阅读结构
二、三级标题目录与重复标题稳定锚点
真实写作验证
浏览器 Markdown 安全预览实践覆盖长文目录、表格、外链与多语言代码块
博客草稿交接
完整 Frontmatter、已登记分类标签与安全发布默认值已验证安全草稿不进入生产构建,并完成一次人工复核后的正式发布
数据边界
不上传草稿,不提供云同步
公开源码
暂无公开仓库

下一步计划

  1. 在真实写作出现重复整理阻塞后评估片段库和全文搜索
  2. 增加代码块复制和可选行号
  3. 支持可审查的 HTML 导出
  4. 评估独立部署和公开源码