ゴゴゴゴゴ
Skip to content
JOJO
首页文章项目知识库相册音乐
全站搜索
  • Navigate
  • Go to Page
  • escClose
© 2026 JOJOBuilt with Next.js

四种声音一个时代

这里收藏周杰伦、王力宏、陶喆与林俊杰的专辑,也把四位创作者放回完整唱片的语境。陶喆以松弛的律动重塑华语 R&B,周杰伦把说唱、古典与中国式旋律带进流行音乐,王力宏在抒情、摇滚和东方元素之间拓宽制作边界,林俊杰则用细密旋律与宽阔声线记录城市情绪。这里不打乱曲序,也不把专辑压缩成热门单曲;挑一张封面,从第一首听到最后一首,感受开场、中段与尾声如何共同完成一段叙事。

左右滑动浏览,轻触封面,从第一首开始听

正在播放的唱片

选择一首歌曲查看歌词
专辑封面

专辑

    请选择一张唱片等待选曲
    0:00
    0:00

    键盘快捷键

    搜索
    / 或 ⌘K
    回到首页
    G H
    博客列表
    G B
    切换主题
    T
    关闭弹窗
    Esc
    显示帮助
    ?

    按 Esc 关闭此窗口

    Blog550
    • 全部文章(550)
    • 包管理工具(8)
      • Bun 完全指南
      • fnm 完全指南
      • ni 完全指南
      • npm 完全指南
      • nrm 完全指南
      • nvm 完全指南
      • pnpm 完全指南
      • Yarn 完全指南
    • 并发异步(7)
      • 异步任务取消机制
      • Promise静态方法汇总
      • 封装超时工具方法
      • 并发与并行
      • 封装并发任务方法
      • 一道并发相关的面试题
      • 文件写入的原子化与并发操作
    • 打包工具(10)
      • Bun - 全栈 JavaScript 运行时与打包器
      • esbuild - 用 Go 写的极速打包器
      • Parcel - 零配置的极速打包工具
      • Rolldown - Vite 团队打造的 Rust 打包器
      • Rollup - 专注于库开发的打包工具
      • Rspack - Rust 驱动的 Webpack 替代品
      • SWC - Rust 驱动的超快编译器
      • Turbopack - Rust 驱动的下一代打包工具
      • Vite - 下一代前端构建工具
      • Webpack - 功能最强大的模块打包器
    • 算法(74)
      • 课程必看
      • 算法基本概念
      • 评判算法的好坏
      • 复习对数
      • 常见的复杂度
      • 常见算法思维
      • 递归
      • 数据结构
      • 数组结构
      • 顺序查找
      • 二分查找
      • 插值查找
      • 冒泡排序
      • 选择排序
      • 插入排序
      • 折半插入排序
      • 希尔排序
      • 归并排序
      • 快速排序
      • 链表结构
      • 双向链表
      • 单向循环链表
      • 双向循环链表
      • 栈结构
      • 队列结构
      • 循环队列
      • 击鼓传花游戏
      • 双端队列
      • 回文检查器
      • 集合结构
      • 字典结构
      • 树结构
      • 二叉树
      • 二叉树遍历
      • 前序中序还原二叉树
      • 后序中序还原二叉树
      • 二叉树深度优先搜索
      • 二叉树广度优先搜索
      • 二叉树的比较
      • 二叉树diff算法
      • 二叉搜索树
      • 二叉搜索树常见操作
      • 平衡二叉树
      • 二叉树左单旋
      • 二叉树右单旋
      • 二叉树双旋
      • 二叉堆
      • 堆排序
      • 哈夫曼树
      • 图结构
      • 邻接矩阵
      • 邻接表
      • 构建图
      • 图的深度优先搜索
      • 图的广度优先搜索
      • 普里姆算法
      • 克鲁斯卡尔算法
      • LRU算法
      • 动态规划
      • 青蛙跳台阶
      • 不同路径问题
      • 凑零钱问题
      • 打家劫舍
      • 背包问题
      • 回溯算法
      • 数字组合
      • 电话号码字母组合
      • 复原IP地址
      • 数组子集
      • 贪心算法
      • 柠檬水找零
      • 摆动序列
      • 分发糖果
      • 跳跃游戏
    • 文档协同(12)
      • 课程说明
      • 文档协同常见方案
      • OT冲突算法
      • CRDT冲突算法
      • CRDT数据结构
      • 文章翻译
      • Yjs基础介绍
      • Yjs快速上手
      • Yjs细节补充
      • 监听机制
      • 标签页同步
      • WebSocket基础知识
    • 项目实战(1)
      • ShipAny:1小时开发海外游客「中国攻略 + AI旅游助手」SaaS网站
    • AI工具(9)
      • Claude Code 完全指南
      • ComfyUI 完全指南
      • GitHub Copilot 入门指南
      • Coze 完全指南
      • Cursor vs GitHub Copilot 全面对比
      • Cursor-完整指南
      • Dify 完全指南
      • Droid 完全指南
      • n8n 完全指南
    • Astro(5)
      • Astro 入门指南
      • Astro 路由与页面
      • Astro 组件与样式
      • Astro 内容集合
      • Astro 集成与部署
    • CSS(25)
      • CSS 选择器基础
      • CSS 盒模型
      • CSS 定位与层叠
      • 浮动与 BFC
      • Flexbox 布局
      • Grid 布局
      • 响应式设计
      • 伪类与伪元素
      • 现代选择器
      • CSS 变量
      • 层叠层
      • 过渡效果
      • CSS 动画
      • 变换与滤镜
      • 容器查询
      • 文字与排版
      • 背景与渐变
      • 滚动与溢出
      • 裁剪与遮罩
      • 颜色系统
      • 边框与阴影
      • 逻辑属性
      • CSS 函数
      • 多列布局
      • 用户交互
    • ES6+(40)
      • let 和 const 命令
      • 解构赋值基础
      • 解构赋值进阶
      • 字符串的扩展
      • 字符串新增方法
      • 正则表达式扩展
      • 数值的扩展
      • BigInt 大整数
      • 函数默认参数
      • rest 参数与扩展运算符
      • 箭头函数详解
      • 尾调用优化
      • 数组扩展方法
      • 数组新增方法
      • 数组不可变方法
      • 对象的扩展
      • Object 新增方法
      • Symbol 基础
      • Symbol 进阶应用
      • Set 数据结构
      • Map 数据结构
      • TypedArray 类型化数组
      • Proxy 基础
      • Proxy 进阶应用
      • Reflect 元编程
      • 元编程实战案例
      • 装饰器 Decorator
      • Iterator 迭代器
      • Generator 基础
      • Generator 进阶
      • Promise 基础
      • Promise 进阶
      • async 函数
      • await 与错误处理
      • 异步迭代
      • Class 基础
      • Class 继承
      • Module 语法
      • Module 加载
      • ES 新特性汇总
    • HTML(8)
      • HTML 入门:构建 Web 的基石
      • HTML5 语义化:让页面更有意义
      • HTML 表单基础:用户交互的起点
      • HTML 表单进阶:验证与现代特性
      • HTML 多媒体:音视频与响应式图片
      • HTML APIs(上):客户端存储完全指南
      • HTML APIs(下):交互与设备能力
      • Canvas 与 SVG:Web 图形绘制入门
    • JavaScript(30)
      • JavaScript 简介
      • 变量与数据类型
      • 运算符
      • 类型转换
      • 控制流语句
      • 函数基础
      • 对象基础
      • 数组基础
      • 原型与原型链
      • this 关键字
      • 面向对象编程
      • 作用域
      • 闭包
      • 执行上下文
      • DOM 选择器
      • DOM 操作
      • 事件处理
      • 事件委托
      • 错误处理
      • 调试技巧
      • 正则表达式
      • Date 日期对象
      • Math 对象
      • 定时器
      • JSON 处理
      • BOM 基础
      • 本地存储
      • 表单处理
      • AJAX 与 Fetch
      • 严格模式
    • Langchain(37)
      • Langchain基本介绍
      • 模型接口
      • 缓存
      • 提示词模板
      • 结构化提示词
      • Message消息对象
      • 消息占位
      • LCEL
      • 并发流式返回结果
      • Runnable接口
      • 条件路由
      • 字符串解析器
      • 结构化输出解析器
      • 列表输出解析器
      • JSON解析器
      • 正则解析器
      • 本地资源Loader
      • Web资源Loader
      • 文本切割
      • 嵌入处理
      • 内存型向量库
      • 检索优化
      • RAG实践
      • Memory基础
      • 自动维护聊天记录
      • 实现长程记忆
      • 持久化记忆
      • 第三方存储
      • Tools基础
      • Tools配置
      • Zod基础
      • LangChain中使用工具
      • 重新认识Agent
      • LangChain中创建Agent
      • Agent实践
      • 回退机制
      • 回调机制
    • LLM(34)
      • LLM发展历史
      • N-Gram模型
      • 词袋模型
      • 词元
      • 嵌入
      • Transformer内部结构
      • Transformer解码策略
      • Transformer块
      • 本地部署大模型
      • Agent
      • 流式返回信息
      • 支持上下文
      • 获取实时消息
      • 外接DeepSeek
      • Function Calling
      • MCP理论知识
      • Resources
      • Schema
      • 注册资源模板
      • Prompts
      • 监听资源更新
      • 远程通信方式
      • MCP Client
      • 大模型幻觉
      • RCT构词法
      • 提示词常见技巧
      • 基于反馈迭代优化
      • 改善提示效果
      • 提示词评估工具
      • RAG基础知识
      • RAG实践
      • RAG架构演进
      • 大模型微调
      • LoRA微调
    • MCP(8)
      • MCP 入门:连接 AI 与外部世界的桥梁
      • 搭建第一个 MCP Server
      • MCP Tools 深入:让 AI 具备行动能力
      • MCP Resources:向 AI 暴露数据
      • MCP Prompts:预定义 AI 交互模板
      • MCP Transport 与部署
      • 构建 MCP Client:集成到你的应用
      • 实战:构建文档助手 MCP Server
    • Nest(31)
      • 快速上手Nest Cli
      • 三层架构与MVC
      • IoC
      • Nest中的装饰器
      • 模块的基本概念
      • 什么是AOP
      • 中间件与守卫
      • 拦截器
      • 文件上传
      • 自定义装饰器
      • mysql相关回顾
      • 对于ORM的理解
      • 快速上手Redis
      • Nest中使用Redis
      • 状态保存方式
      • Nest中实现Session与JWT
      • JWT登录注册后端处理
      • 使用Passport与循环引用问题
      • 通过环境变量获取配置信息
      • RBAC权限设计1
      • RBAC权限设计2
      • Nest中使用Websocket
      • 日志处理
      • 面向切面的日志处理
      • 快速入门GraphQL
      • Nest中使用GraphQL
      • Swagger API文档
      • 单元测试与E2E测试
      • 安全防护实践
      • 定时任务与任务调度
      • Bull队列与异步任务
    • Next(36)
      • Next.js 简介
      • 项目创建与配置
      • App Router 概述
      • 创建第一个页面
      • 开发工具与调试
      • TypeScript 配置
      • 文件系统路由
      • 动态路由
      • 嵌套路由与布局
      • 路由组
      • 并行路由
      • 拦截路由
      • 导航与链接
      • 中间件
      • Server Components
      • Client Components
      • 混合渲染模式
      • Streaming 与 Suspense
      • 静态与动态渲染
      • 数据获取基础
      • 缓存策略
      • Server Actions
      • Route Handlers
      • 数据库集成
      • 错误处理
      • 图片优化
      • 字体优化
      • 脚本优化
      • 元数据与 SEO
      • 性能分析
      • 认证基础
      • NextAuth 集成
      • 环境变量与配置
      • 测试策略
      • 部署方案
      • 项目实战
    • Nuxt(36)
      • web应用变迁史
      • 课程说明
      • SSR初体验
      • 水合操作
      • 改造CSR项目
      • 基本介绍
      • 配置概览
      • 组件类型
      • Nuxt模块
      • 嵌套路由
      • 动态路由
      • 请求数据
      • server目录
      • 应用部署
      • 中间件
      • 插件
      • layers
      • 过渡
      • 状态管理
      • 全匹配路由
      • 路由补充知识
      • 自定义路由
      • 自定义模块
      • 自定义指令
      • meta相关处理
      • 渲染模式
      • 错误处理
      • 不同阶段错误
      • 客户端渲染组件
      • 其余内置组件
      • 配置相关细节
      • 常用组合式函数
      • 服务器引擎
      • NuxtUI
      • SSR注意事项
      • 课程收官
    • React(55)
      • 序章:React课程介绍
      • React 基本介绍
      • JSX 基础语法
      • 组件与事件绑定
      • 组件状态与数据传递
      • 表单
      • 生命周期
      • Hooks
      • React-router介绍
      • React-router v版本学生管理系统课堂笔记
      • React-redux 介绍
      • Antd介绍
      • coder station前台系统笔记
      • coder station 后台系统笔记
      • Antd Pro介绍
      • Dva介绍
      • Umi.js 介绍
      • 属性默认值和类型验证
      • 高阶组件
      • Ref
      • Context
      • Render Props
      • Portals
      • 错误边界
      • 组件渲染性能优化
      • 前端框架的理解
      • Scheduler调度延时任务
      • 最小堆
      • React中的位运算
      • beginWork工作流程
      • completeWork工作流程
      • 图解diff算法
      • commit 工作流程
      • lane模型
      • React 中的事件
      • Hooks原理
      • React和Vue描述页面的区别
      • useState和useReducer
      • effect相关hook
      • useCallback和useMemo
      • useRef
      • Update
      • 性能优化策略之eagerState
      • 性能优化策略之bailout
      • bailout和ContextAPI
      • 性能优化对日常开发启示
      • 前端框架的分类
      • 虚拟 DOM
      • React 整体架构
      • React 渲染流程
      • Fiber双缓冲
      • MessageChannel
      • Scheduler调度普通任务
      • 课程介绍
      • 课程总结
    • ReactNative(33)
      • RN 基本介绍
      • 快速搭建 RN 开发环境
      • 复习 React 基础知识
      • RN 基础知识
      • 实战案例
      • RN 内置基础组件
      • 容器组件
      • Pressable 组件
      • 列表组件
      • 功能组件
      • 第三方组件库
      • 自定义组件案例:弹框组件
      • 自定义组件案例:单选组件
      • 基础API
      • 屏幕API
      • 设备API
      • 动画API
      • 手势API
      • React Navigation简介
      • 参数传递和标题栏信息配置
      • 嵌套路由与生命周期
      • 其他类型的导航
      • 状态管理介绍
      • Redux
      • 其他第三方库
      • Expo SDK
      • Fabric 架构
      • 渲染、提交和挂载
      • 实现跨平台
      • 扁平化视图
      • 线程模型
      • 如何打包发布应用
      • 通过 React Native CLI 搭建环境
    • TailwindCSS(7)
      • TailwindCSS基础介绍
      • 环境搭建与配置
      • 布局系统
      • 间距与尺寸系统
      • 颜色与主题
      • 响应式设计
      • 交互与动画
    • TypeScript(35)
      • 初识 TypeScript
      • 基础类型
      • 数组与元组
      • 对象类型
      • 函数类型
      • 类型推断与断言
      • 联合类型与交叉类型
      • 字面量类型与类型别名
      • 接口基础
      • 接口进阶
      • 接口继承与实现
      • 类基础
      • 类的访问修饰符
      • 类的继承
      • 类与接口对比
      • 泛型基础
      • 泛型接口与泛型类
      • 泛型约束
      • 内置工具类型(上)
      • 内置工具类型(下)
      • 泛型实战
      • 类型守卫
      • 类型收窄
      • 索引类型与索引签名
      • 映射类型
      • 条件类型
      • infer 关键字
      • 模板字面量类型
      • 模块系统
      • 命名空间
      • 声明文件基础
      • 声明文件进阶
      • tsconfig 配置详解
      • 类型体操入门
      • TypeScript 最佳实践
    • 杂谈(9)
      • Cloudflare 全栈部署指南
      • Creem 支付集成指南
      • Dokploy 自托管部署指南
      • GitHub OAuth 登录集成指南
      • Google OAuth 登录集成指南
      • Stripe 支付集成指南
      • Supabase 完全指南
      • Vercel 自动化部署指南
      • Zeabur 部署指南
    • 全部文章(550)
    • 包管理工具(8)
      • Bun 完全指南
      • fnm 完全指南
      • ni 完全指南
      • npm 完全指南
      • nrm 完全指南
      • nvm 完全指南
      • pnpm 完全指南
      • Yarn 完全指南
    • 并发异步(7)
      • 异步任务取消机制
      • Promise静态方法汇总
      • 封装超时工具方法
      • 并发与并行
      • 封装并发任务方法
      • 一道并发相关的面试题
      • 文件写入的原子化与并发操作
    • 打包工具(10)
      • Bun - 全栈 JavaScript 运行时与打包器
      • esbuild - 用 Go 写的极速打包器
      • Parcel - 零配置的极速打包工具
      • Rolldown - Vite 团队打造的 Rust 打包器
      • Rollup - 专注于库开发的打包工具
      • Rspack - Rust 驱动的 Webpack 替代品
      • SWC - Rust 驱动的超快编译器
      • Turbopack - Rust 驱动的下一代打包工具
      • Vite - 下一代前端构建工具
      • Webpack - 功能最强大的模块打包器
    • 算法(74)
      • 课程必看
      • 算法基本概念
      • 评判算法的好坏
      • 复习对数
      • 常见的复杂度
      • 常见算法思维
      • 递归
      • 数据结构
      • 数组结构
      • 顺序查找
      • 二分查找
      • 插值查找
      • 冒泡排序
      • 选择排序
      • 插入排序
      • 折半插入排序
      • 希尔排序
      • 归并排序
      • 快速排序
      • 链表结构
      • 双向链表
      • 单向循环链表
      • 双向循环链表
      • 栈结构
      • 队列结构
      • 循环队列
      • 击鼓传花游戏
      • 双端队列
      • 回文检查器
      • 集合结构
      • 字典结构
      • 树结构
      • 二叉树
      • 二叉树遍历
      • 前序中序还原二叉树
      • 后序中序还原二叉树
      • 二叉树深度优先搜索
      • 二叉树广度优先搜索
      • 二叉树的比较
      • 二叉树diff算法
      • 二叉搜索树
      • 二叉搜索树常见操作
      • 平衡二叉树
      • 二叉树左单旋
      • 二叉树右单旋
      • 二叉树双旋
      • 二叉堆
      • 堆排序
      • 哈夫曼树
      • 图结构
      • 邻接矩阵
      • 邻接表
      • 构建图
      • 图的深度优先搜索
      • 图的广度优先搜索
      • 普里姆算法
      • 克鲁斯卡尔算法
      • LRU算法
      • 动态规划
      • 青蛙跳台阶
      • 不同路径问题
      • 凑零钱问题
      • 打家劫舍
      • 背包问题
      • 回溯算法
      • 数字组合
      • 电话号码字母组合
      • 复原IP地址
      • 数组子集
      • 贪心算法
      • 柠檬水找零
      • 摆动序列
      • 分发糖果
      • 跳跃游戏
    • 文档协同(12)
      • 课程说明
      • 文档协同常见方案
      • OT冲突算法
      • CRDT冲突算法
      • CRDT数据结构
      • 文章翻译
      • Yjs基础介绍
      • Yjs快速上手
      • Yjs细节补充
      • 监听机制
      • 标签页同步
      • WebSocket基础知识
    • 项目实战(1)
      • ShipAny:1小时开发海外游客「中国攻略 + AI旅游助手」SaaS网站
    • AI工具(9)
      • Claude Code 完全指南
      • ComfyUI 完全指南
      • GitHub Copilot 入门指南
      • Coze 完全指南
      • Cursor vs GitHub Copilot 全面对比
      • Cursor-完整指南
      • Dify 完全指南
      • Droid 完全指南
      • n8n 完全指南
    • Astro(5)
      • Astro 入门指南
      • Astro 路由与页面
      • Astro 组件与样式
      • Astro 内容集合
      • Astro 集成与部署
    • CSS(25)
      • CSS 选择器基础
      • CSS 盒模型
      • CSS 定位与层叠
      • 浮动与 BFC
      • Flexbox 布局
      • Grid 布局
      • 响应式设计
      • 伪类与伪元素
      • 现代选择器
      • CSS 变量
      • 层叠层
      • 过渡效果
      • CSS 动画
      • 变换与滤镜
      • 容器查询
      • 文字与排版
      • 背景与渐变
      • 滚动与溢出
      • 裁剪与遮罩
      • 颜色系统
      • 边框与阴影
      • 逻辑属性
      • CSS 函数
      • 多列布局
      • 用户交互
    • ES6+(40)
      • let 和 const 命令
      • 解构赋值基础
      • 解构赋值进阶
      • 字符串的扩展
      • 字符串新增方法
      • 正则表达式扩展
      • 数值的扩展
      • BigInt 大整数
      • 函数默认参数
      • rest 参数与扩展运算符
      • 箭头函数详解
      • 尾调用优化
      • 数组扩展方法
      • 数组新增方法
      • 数组不可变方法
      • 对象的扩展
      • Object 新增方法
      • Symbol 基础
      • Symbol 进阶应用
      • Set 数据结构
      • Map 数据结构
      • TypedArray 类型化数组
      • Proxy 基础
      • Proxy 进阶应用
      • Reflect 元编程
      • 元编程实战案例
      • 装饰器 Decorator
      • Iterator 迭代器
      • Generator 基础
      • Generator 进阶
      • Promise 基础
      • Promise 进阶
      • async 函数
      • await 与错误处理
      • 异步迭代
      • Class 基础
      • Class 继承
      • Module 语法
      • Module 加载
      • ES 新特性汇总
    • HTML(8)
      • HTML 入门:构建 Web 的基石
      • HTML5 语义化:让页面更有意义
      • HTML 表单基础:用户交互的起点
      • HTML 表单进阶:验证与现代特性
      • HTML 多媒体:音视频与响应式图片
      • HTML APIs(上):客户端存储完全指南
      • HTML APIs(下):交互与设备能力
      • Canvas 与 SVG:Web 图形绘制入门
    • JavaScript(30)
      • JavaScript 简介
      • 变量与数据类型
      • 运算符
      • 类型转换
      • 控制流语句
      • 函数基础
      • 对象基础
      • 数组基础
      • 原型与原型链
      • this 关键字
      • 面向对象编程
      • 作用域
      • 闭包
      • 执行上下文
      • DOM 选择器
      • DOM 操作
      • 事件处理
      • 事件委托
      • 错误处理
      • 调试技巧
      • 正则表达式
      • Date 日期对象
      • Math 对象
      • 定时器
      • JSON 处理
      • BOM 基础
      • 本地存储
      • 表单处理
      • AJAX 与 Fetch
      • 严格模式
    • Langchain(37)
      • Langchain基本介绍
      • 模型接口
      • 缓存
      • 提示词模板
      • 结构化提示词
      • Message消息对象
      • 消息占位
      • LCEL
      • 并发流式返回结果
      • Runnable接口
      • 条件路由
      • 字符串解析器
      • 结构化输出解析器
      • 列表输出解析器
      • JSON解析器
      • 正则解析器
      • 本地资源Loader
      • Web资源Loader
      • 文本切割
      • 嵌入处理
      • 内存型向量库
      • 检索优化
      • RAG实践
      • Memory基础
      • 自动维护聊天记录
      • 实现长程记忆
      • 持久化记忆
      • 第三方存储
      • Tools基础
      • Tools配置
      • Zod基础
      • LangChain中使用工具
      • 重新认识Agent
      • LangChain中创建Agent
      • Agent实践
      • 回退机制
      • 回调机制
    • LLM(34)
      • LLM发展历史
      • N-Gram模型
      • 词袋模型
      • 词元
      • 嵌入
      • Transformer内部结构
      • Transformer解码策略
      • Transformer块
      • 本地部署大模型
      • Agent
      • 流式返回信息
      • 支持上下文
      • 获取实时消息
      • 外接DeepSeek
      • Function Calling
      • MCP理论知识
      • Resources
      • Schema
      • 注册资源模板
      • Prompts
      • 监听资源更新
      • 远程通信方式
      • MCP Client
      • 大模型幻觉
      • RCT构词法
      • 提示词常见技巧
      • 基于反馈迭代优化
      • 改善提示效果
      • 提示词评估工具
      • RAG基础知识
      • RAG实践
      • RAG架构演进
      • 大模型微调
      • LoRA微调
    • MCP(8)
      • MCP 入门:连接 AI 与外部世界的桥梁
      • 搭建第一个 MCP Server
      • MCP Tools 深入:让 AI 具备行动能力
      • MCP Resources:向 AI 暴露数据
      • MCP Prompts:预定义 AI 交互模板
      • MCP Transport 与部署
      • 构建 MCP Client:集成到你的应用
      • 实战:构建文档助手 MCP Server
    • Nest(31)
      • 快速上手Nest Cli
      • 三层架构与MVC
      • IoC
      • Nest中的装饰器
      • 模块的基本概念
      • 什么是AOP
      • 中间件与守卫
      • 拦截器
      • 文件上传
      • 自定义装饰器
      • mysql相关回顾
      • 对于ORM的理解
      • 快速上手Redis
      • Nest中使用Redis
      • 状态保存方式
      • Nest中实现Session与JWT
      • JWT登录注册后端处理
      • 使用Passport与循环引用问题
      • 通过环境变量获取配置信息
      • RBAC权限设计1
      • RBAC权限设计2
      • Nest中使用Websocket
      • 日志处理
      • 面向切面的日志处理
      • 快速入门GraphQL
      • Nest中使用GraphQL
      • Swagger API文档
      • 单元测试与E2E测试
      • 安全防护实践
      • 定时任务与任务调度
      • Bull队列与异步任务
    • Next(36)
      • Next.js 简介
      • 项目创建与配置
      • App Router 概述
      • 创建第一个页面
      • 开发工具与调试
      • TypeScript 配置
      • 文件系统路由
      • 动态路由
      • 嵌套路由与布局
      • 路由组
      • 并行路由
      • 拦截路由
      • 导航与链接
      • 中间件
      • Server Components
      • Client Components
      • 混合渲染模式
      • Streaming 与 Suspense
      • 静态与动态渲染
      • 数据获取基础
      • 缓存策略
      • Server Actions
      • Route Handlers
      • 数据库集成
      • 错误处理
      • 图片优化
      • 字体优化
      • 脚本优化
      • 元数据与 SEO
      • 性能分析
      • 认证基础
      • NextAuth 集成
      • 环境变量与配置
      • 测试策略
      • 部署方案
      • 项目实战
    • Nuxt(36)
      • web应用变迁史
      • 课程说明
      • SSR初体验
      • 水合操作
      • 改造CSR项目
      • 基本介绍
      • 配置概览
      • 组件类型
      • Nuxt模块
      • 嵌套路由
      • 动态路由
      • 请求数据
      • server目录
      • 应用部署
      • 中间件
      • 插件
      • layers
      • 过渡
      • 状态管理
      • 全匹配路由
      • 路由补充知识
      • 自定义路由
      • 自定义模块
      • 自定义指令
      • meta相关处理
      • 渲染模式
      • 错误处理
      • 不同阶段错误
      • 客户端渲染组件
      • 其余内置组件
      • 配置相关细节
      • 常用组合式函数
      • 服务器引擎
      • NuxtUI
      • SSR注意事项
      • 课程收官
    • React(55)
      • 序章:React课程介绍
      • React 基本介绍
      • JSX 基础语法
      • 组件与事件绑定
      • 组件状态与数据传递
      • 表单
      • 生命周期
      • Hooks
      • React-router介绍
      • React-router v版本学生管理系统课堂笔记
      • React-redux 介绍
      • Antd介绍
      • coder station前台系统笔记
      • coder station 后台系统笔记
      • Antd Pro介绍
      • Dva介绍
      • Umi.js 介绍
      • 属性默认值和类型验证
      • 高阶组件
      • Ref
      • Context
      • Render Props
      • Portals
      • 错误边界
      • 组件渲染性能优化
      • 前端框架的理解
      • Scheduler调度延时任务
      • 最小堆
      • React中的位运算
      • beginWork工作流程
      • completeWork工作流程
      • 图解diff算法
      • commit 工作流程
      • lane模型
      • React 中的事件
      • Hooks原理
      • React和Vue描述页面的区别
      • useState和useReducer
      • effect相关hook
      • useCallback和useMemo
      • useRef
      • Update
      • 性能优化策略之eagerState
      • 性能优化策略之bailout
      • bailout和ContextAPI
      • 性能优化对日常开发启示
      • 前端框架的分类
      • 虚拟 DOM
      • React 整体架构
      • React 渲染流程
      • Fiber双缓冲
      • MessageChannel
      • Scheduler调度普通任务
      • 课程介绍
      • 课程总结
    • ReactNative(33)
      • RN 基本介绍
      • 快速搭建 RN 开发环境
      • 复习 React 基础知识
      • RN 基础知识
      • 实战案例
      • RN 内置基础组件
      • 容器组件
      • Pressable 组件
      • 列表组件
      • 功能组件
      • 第三方组件库
      • 自定义组件案例:弹框组件
      • 自定义组件案例:单选组件
      • 基础API
      • 屏幕API
      • 设备API
      • 动画API
      • 手势API
      • React Navigation简介
      • 参数传递和标题栏信息配置
      • 嵌套路由与生命周期
      • 其他类型的导航
      • 状态管理介绍
      • Redux
      • 其他第三方库
      • Expo SDK
      • Fabric 架构
      • 渲染、提交和挂载
      • 实现跨平台
      • 扁平化视图
      • 线程模型
      • 如何打包发布应用
      • 通过 React Native CLI 搭建环境
    • TailwindCSS(7)
      • TailwindCSS基础介绍
      • 环境搭建与配置
      • 布局系统
      • 间距与尺寸系统
      • 颜色与主题
      • 响应式设计
      • 交互与动画
    • TypeScript(35)
      • 初识 TypeScript
      • 基础类型
      • 数组与元组
      • 对象类型
      • 函数类型
      • 类型推断与断言
      • 联合类型与交叉类型
      • 字面量类型与类型别名
      • 接口基础
      • 接口进阶
      • 接口继承与实现
      • 类基础
      • 类的访问修饰符
      • 类的继承
      • 类与接口对比
      • 泛型基础
      • 泛型接口与泛型类
      • 泛型约束
      • 内置工具类型(上)
      • 内置工具类型(下)
      • 泛型实战
      • 类型守卫
      • 类型收窄
      • 索引类型与索引签名
      • 映射类型
      • 条件类型
      • infer 关键字
      • 模板字面量类型
      • 模块系统
      • 命名空间
      • 声明文件基础
      • 声明文件进阶
      • tsconfig 配置详解
      • 类型体操入门
      • TypeScript 最佳实践
    • 杂谈(9)
      • Cloudflare 全栈部署指南
      • Creem 支付集成指南
      • Dokploy 自托管部署指南
      • GitHub OAuth 登录集成指南
      • Google OAuth 登录集成指南
      • Stripe 支付集成指南
      • Supabase 完全指南
      • Vercel 自动化部署指南
      • Zeabur 部署指南

    实战:构建文档助手 MCP Server

    2025年12月3日 · 13 min
    ChatGPTClaude

    经过前面 7 篇文章的学习,我们已经掌握了 MCP 的核心概念和 API。这篇文章将综合运用所学知识,从零构建一个完整的 Markdown 文档助手 MCP Server。

    🎯 项目目标

    创建一个 MCP Server,让 AI 能够:

    • 浏览和读取指定目录下的 Markdown 文档
    • 全文搜索文档内容
    • 基于文档内容回答问题
    • 生成文档摘要

    功能设计

    Tools(AI 可调用的操作)

    Tool功能
    search_docs搜索文档内容
    get_doc_structure获取文档目录结构

    Resources(暴露给 AI 的数据)

    Resource功能
    docs://{path}访问具体文档内容
    docs://index文档索引和统计

    Prompts(预设交互模板)

    Prompt功能
    summarize生成文档摘要
    explain解释文档中的概念
    qa基于文档问答

    项目初始化

    目录结构

    mcp-docs-assistant/
    ├── src/
    │ ├── index.ts # 入口文件
    │ ├── server.ts # MCP Server 定义
    │ ├── tools.ts # Tools 实现
    │ ├── resources.ts # Resources 实现
    │ ├── prompts.ts # Prompts 实现
    │ └── utils/
    │ ├── markdown.ts # Markdown 处理
    │ └── search.ts # 搜索功能
    ├── package.json
    └── tsconfig.json

    package.json

    {
    "name": "mcp-docs-assistant",
    "version": "1.0.0",
    "type": "module",
    "main": "dist/index.js",
    "bin": {
    "mcp-docs-assistant": "dist/index.js"
    },
    "scripts": {
    "build": "tsc",
    "start": "node dist/index.js",
    "dev": "tsx src/index.ts"
    },
    "dependencies": {
    "@modelcontextprotocol/sdk": "^1.0.0",
    "glob": "^10.3.10",
    "gray-matter": "^4.0.3",
    "zod": "^3.22.0"
    },
    "devDependencies": {
    "@types/node": "^20.10.0",
    "tsx": "^4.6.0",
    "typescript": "^5.3.0"
    }
    }

    tsconfig.json

    {
    "compilerOptions": {
    "target": "ES2022",
    "module": "Node16",
    "moduleResolution": "Node16",
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "outDir": "./dist",
    "rootDir": "./src",
    "declaration": true
    },
    "include": ["src/**/*"]
    }

    核心实现

    工具函数:Markdown 处理

    src/utils/markdown.ts
    import { readFile } from 'fs/promises'
    import matter from 'gray-matter'
    export interface DocMeta {
    title: string
    description?: string
    tags?: string[]
    date?: string
    }
    export interface ParsedDoc {
    path: string
    meta: DocMeta
    content: string
    headings: string[]
    }
    export async function parseMarkdown(filePath: string): Promise<ParsedDoc> {
    const raw = await readFile(filePath, 'utf-8')
    const { data, content } = matter(raw)
    // 提取标题
    const headings = content
    .split('\n')
    .filter((line) => line.startsWith('#'))
    .map((line) => line.replace(/^#+\s*/, ''))
    // 提取 meta
    const meta: DocMeta = {
    title: data.title || headings[0] || filePath.split('/').pop() || 'Untitled',
    description: data.description,
    tags: data.tags,
    date: data.date?.toString(),
    }
    return { path: filePath, meta, content, headings }
    }
    export function extractSummary(content: string, maxLength = 200): string {
    // 移除 Markdown 语法
    const plain = content
    .replace(/^#+\s+/gm, '') // 标题
    .replace(/\*\*|__/g, '') // 粗体
    .replace(/\*|_/g, '') // 斜体
    .replace(/`{1,3}[^`]*`{1,3}/g, '') // 代码
    .replace(/\[([^\]]+)\]\([^)]+\)/g, '$1') // 链接
    .replace(/\n+/g, ' ') // 换行
    .trim()
    if (plain.length <= maxLength) return plain
    return plain.slice(0, maxLength).trim() + '...'
    }

    工具函数:搜索功能

    src/utils/search.ts
    import { glob } from 'glob'
    import { parseMarkdown, type ParsedDoc } from './markdown.js'
    export interface SearchResult {
    path: string
    title: string
    matches: string[]
    score: number
    }
    export class DocIndex {
    private docs: ParsedDoc[] = []
    private baseDir: string
    constructor(baseDir: string) {
    this.baseDir = baseDir
    }
    async build(): Promise<void> {
    const files = await glob('**/*.md', { cwd: this.baseDir, absolute: true })
    this.docs = await Promise.all(files.map((file) => parseMarkdown(file)))
    console.error(`Indexed ${this.docs.length} documents`)
    }
    search(query: string, limit = 10): SearchResult[] {
    const queryLower = query.toLowerCase()
    const queryTerms = queryLower.split(/\s+/).filter((t) => t.length > 1)
    const results: SearchResult[] = []
    for (const doc of this.docs) {
    const contentLower = doc.content.toLowerCase()
    const titleLower = doc.meta.title.toLowerCase()
    let score = 0
    const matches: string[] = []
    // 标题匹配(高权重)
    for (const term of queryTerms) {
    if (titleLower.includes(term)) {
    score += 10
    }
    }
    // 内容匹配
    for (const term of queryTerms) {
    const regex = new RegExp(term, 'gi')
    const contentMatches = contentLower.match(regex)
    if (contentMatches) {
    score += contentMatches.length
    // 提取上下文
    const lines = doc.content.split('\n')
    for (const line of lines) {
    if (line.toLowerCase().includes(term) && matches.length < 3) {
    matches.push(line.trim().slice(0, 100))
    }
    }
    }
    }
    if (score > 0) {
    results.push({
    path: doc.path.replace(this.baseDir, '').replace(/^\//, ''),
    title: doc.meta.title,
    matches: [...new Set(matches)], // 去重
    score,
    })
    }
    }
    return results.sort((a, b) => b.score - a.score).slice(0, limit)
    }
    getDoc(relativePath: string): ParsedDoc | undefined {
    const fullPath = `${this.baseDir}/${relativePath}`
    return this.docs.find((d) => d.path === fullPath)
    }
    getAllDocs(): ParsedDoc[] {
    return this.docs
    }
    getStats() {
    return {
    totalDocs: this.docs.length,
    totalWords: this.docs.reduce(
    (sum, doc) => sum + doc.content.split(/\s+/).length,
    0
    ),
    tags: [...new Set(this.docs.flatMap((d) => d.meta.tags || []))],
    }
    }
    }

    Tools 实现

    src/tools.ts
    import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js'
    import { z } from 'zod'
    import { DocIndex } from './utils/search.js'
    export function registerTools(server: McpServer, index: DocIndex) {
    // 搜索文档
    server.registerTool(
    'search_docs',
    {
    title: '搜索文档',
    description: '在文档库中搜索包含指定关键词的内容',
    inputSchema: {
    query: z.string().min(1).describe('搜索关键词'),
    limit: z
    .number()
    .int()
    .min(1)
    .max(20)
    .default(5)
    .describe('返回结果数量'),
    },
    outputSchema: {
    results: z.array(
    z.object({
    path: z.string(),
    title: z.string(),
    matches: z.array(z.string()),
    score: z.number(),
    })
    ),
    },
    },
    async ({ query, limit }) => {
    const results = index.search(query, limit)
    if (results.length === 0) {
    return {
    content: [{ type: 'text', text: `未找到与 "${query}" 相关的文档` }],
    structuredContent: { results: [] },
    }
    }
    const text = results
    .map(
    (r, i) =>
    `${i + 1}. **${r.title}** (${r.path})\n ${r.matches[0] || ''}`
    )
    .join('\n\n')
    return {
    content: [
    {
    type: 'text',
    text: `找到 ${results.length} 个相关文档:\n\n${text}`,
    },
    ],
    structuredContent: { results },
    }
    }
    )
    // 获取文档结构
    server.registerTool(
    'get_doc_structure',
    {
    title: '获取文档结构',
    description: '获取指定文档的标题结构(目录)',
    inputSchema: {
    path: z.string().describe('文档路径(相对路径)'),
    },
    },
    async ({ path }) => {
    const doc = index.getDoc(path)
    if (!doc) {
    return {
    content: [{ type: 'text', text: `文档不存在:${path}` }],
    isError: true,
    }
    }
    const structure = doc.headings.map((h, i) => `${i + 1}. ${h}`).join('\n')
    return {
    content: [
    {
    type: 'text',
    text: `## ${doc.meta.title}\n\n**目录结构:**\n${structure}`,
    },
    ],
    }
    }
    )
    }

    Resources 实现

    src/resources.ts
    import {
    McpServer,
    ResourceTemplate,
    } from '@modelcontextprotocol/sdk/server/mcp.js'
    import { DocIndex } from './utils/search.js'
    import { extractSummary } from './utils/markdown.js'
    export function registerResources(server: McpServer, index: DocIndex) {
    // 文档索引
    server.registerResource(
    'docs-index',
    'docs://index',
    {
    title: '文档索引',
    description: '文档库的索引和统计信息',
    mimeType: 'application/json',
    },
    async (uri) => {
    const stats = index.getStats()
    const docs = index.getAllDocs().map((d) => ({
    path: d.path,
    title: d.meta.title,
    summary: extractSummary(d.content),
    }))
    return {
    contents: [
    {
    uri: uri.href,
    mimeType: 'application/json',
    text: JSON.stringify({ stats, docs }, null, 2),
    },
    ],
    }
    }
    )
    // 单个文档
    server.registerResource(
    'doc-content',
    new ResourceTemplate('docs://{path*}', {
    list: async () => {
    const docs = index.getAllDocs()
    return {
    resources: docs.map((d) => ({
    uri: `docs://${d.path.split('/').slice(-1)[0]}`,
    name: d.meta.title,
    description: d.meta.description || extractSummary(d.content, 100),
    mimeType: 'text/markdown',
    })),
    }
    },
    }),
    {
    title: '文档内容',
    description: '访问具体的文档内容',
    },
    async (uri, { path }) => {
    // 尝试多种路径匹配
    let doc = index.getDoc(path)
    if (!doc) {
    doc = index.getDoc(`${path}.md`)
    }
    if (!doc) {
    // 尝试文件名匹配
    const docs = index.getAllDocs()
    doc = docs.find(
    (d) => d.path.endsWith(`/${path}`) || d.path.endsWith(`/${path}.md`)
    )
    }
    if (!doc) {
    return {
    contents: [
    {
    uri: uri.href,
    mimeType: 'text/plain',
    text: `文档不存在:${path}`,
    },
    ],
    }
    }
    const header = [
    `# ${doc.meta.title}`,
    doc.meta.description ? `\n> ${doc.meta.description}` : '',
    doc.meta.tags?.length ? `\n**标签:** ${doc.meta.tags.join(', ')}` : '',
    '\n---\n',
    ]
    .filter(Boolean)
    .join('')
    return {
    contents: [
    {
    uri: uri.href,
    mimeType: 'text/markdown',
    text: header + doc.content,
    },
    ],
    }
    }
    )
    }

    Prompts 实现

    src/prompts.ts
    import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js'
    import { z } from 'zod'
    import { DocIndex } from './utils/search.js'
    import { extractSummary } from './utils/markdown.js'
    export function registerPrompts(server: McpServer, index: DocIndex) {
    // 文档摘要
    server.registerPrompt(
    'summarize',
    {
    title: '文档摘要',
    description: '生成指定文档的摘要',
    argsSchema: {
    path: z.string().describe('文档路径'),
    },
    },
    ({ path }) => {
    const doc = index.getDoc(path)
    if (!doc) {
    return {
    messages: [
    {
    role: 'user',
    content: { type: 'text', text: `文档不存在:${path}` },
    },
    ],
    }
    }
    return {
    messages: [
    {
    role: 'user',
    content: {
    type: 'text',
    text: `请为以下文档生成一个简洁的摘要(不超过 200 字):
    # ${doc.meta.title}
    ${doc.content}
    要求:
    1. 概括文档的主要内容
    2. 列出关键要点(3-5 个)
    3. 说明目标读者`,
    },
    },
    ],
    }
    }
    )
    // 概念解释
    server.registerPrompt(
    'explain',
    {
    title: '概念解释',
    description: '解释文档中的特定概念',
    argsSchema: {
    concept: z.string().describe('要解释的概念'),
    context: z.string().optional().describe('上下文(可选)'),
    },
    },
    ({ concept, context }) => {
    // 搜索相关文档
    const results = index.search(concept, 3)
    let docContext = ''
    if (results.length > 0) {
    docContext = results
    .map((r) => {
    const doc = index.getDoc(r.path)
    return doc
    ? `## ${doc.meta.title}\n${extractSummary(doc.content, 500)}`
    : ''
    })
    .filter(Boolean)
    .join('\n\n')
    }
    return {
    messages: [
    {
    role: 'user',
    content: {
    type: 'text',
    text: `请解释「${concept}」这个概念。
    ${docContext ? `以下是相关文档内容供参考:\n\n${docContext}\n\n` : ''}
    ${context ? `额外上下文:${context}\n\n` : ''}
    请提供:
    1. 简明定义
    2. 核心要点
    3. 实际应用示例
    4. 常见误区(如有)`,
    },
    },
    ],
    }
    }
    )
    // 文档问答
    server.registerPrompt(
    'qa',
    {
    title: '文档问答',
    description: '基于文档内容回答问题',
    argsSchema: {
    question: z.string().describe('你的问题'),
    },
    },
    ({ question }) => {
    // 搜索相关内容
    const results = index.search(question, 5)
    let context = ''
    if (results.length > 0) {
    context = results
    .map((r) => {
    const doc = index.getDoc(r.path)
    if (!doc) return ''
    return `### ${doc.meta.title}\n${doc.content.slice(0, 1000)}${doc.content.length > 1000 ? '...' : ''}`
    })
    .filter(Boolean)
    .join('\n\n---\n\n')
    }
    return {
    messages: [
    {
    role: 'user',
    content: {
    type: 'text',
    text: `请根据以下文档内容回答我的问题。
    **问题:** ${question}
    ${context ? `**相关文档:**\n\n${context}` : '**注意:** 未找到相关文档,请基于你的知识回答。'}
    请注意:
    1. 如果文档中有答案,请引用具体内容
    2. 如果文档中没有直接答案,请说明
    3. 可以补充文档之外的相关知识`,
    },
    },
    ],
    }
    }
    )
    }

    主 Server 文件

    src/server.ts
    import { McpServer } from '@modelcontextprotocol/sdk/server/mcp.js'
    import { DocIndex } from './utils/search.js'
    import { registerTools } from './tools.js'
    import { registerResources } from './resources.js'
    import { registerPrompts } from './prompts.js'
    export async function createServer(docsDir: string): Promise<McpServer> {
    // 创建文档索引
    const index = new DocIndex(docsDir)
    await index.build()
    // 创建 MCP Server
    const server = new McpServer({
    name: 'docs-assistant',
    version: '1.0.0',
    })
    // 注册功能
    registerTools(server, index)
    registerResources(server, index)
    registerPrompts(server, index)
    return server
    }

    入口文件

    src/index.ts
    #!/usr/bin/env node
    import { StdioServerTransport } from '@modelcontextprotocol/sdk/server/stdio.js'
    import { createServer } from './server.js'
    import { resolve } from 'path'
    async function main() {
    // 从命令行参数或环境变量获取文档目录
    const docsDir = resolve(process.argv[2] || process.env.DOCS_DIR || './docs')
    console.error(`Docs directory: ${docsDir}`)
    try {
    const server = await createServer(docsDir)
    const transport = new StdioServerTransport()
    await server.connect(transport)
    console.error('MCP Docs Assistant is running')
    } catch (error) {
    console.error('Failed to start server:', error)
    process.exit(1)
    }
    }
    main()

    配置与测试

    编译项目

    Terminal window
    pnpm install
    pnpm build

    配置 Claude Desktop

    编辑配置文件:

    {
    "mcpServers": {
    "docs-assistant": {
    "command": "node",
    "args": [
    "/path/to/mcp-docs-assistant/dist/index.js",
    "/path/to/your/docs"
    ]
    }
    }
    }

    测试用例

    重启 Claude Desktop 后,尝试以下对话:

    1. 搜索测试

      “搜索关于 TypeScript 的文档”

    2. 阅读文档

      “请读取 README.md 的内容”

    3. 问答测试

      “根据文档,如何配置 ESLint?”

    4. 摘要生成

      “帮我总结一下 API 文档的主要内容”

    扩展思路

    这个基础版本可以继续扩展:

    1. 增量索引

    // 监听文件变化,增量更新索引
    import { watch } from 'fs'
    watch(docsDir, { recursive: true }, async (event, filename) => {
    if (filename?.endsWith('.md')) {
    await index.updateDoc(filename)
    // 发送资源变更通知
    await server.notification({
    method: 'notifications/resources/list_changed',
    })
    }
    })

    2. 语义搜索

    集成向量数据库实现语义搜索:

    import { embed } from './utils/embeddings.js'
    import { vectorStore } from './utils/vector-store.js'
    async function semanticSearch(query: string) {
    const queryVector = await embed(query)
    return vectorStore.search(queryVector, 10)
    }

    3. 支持更多格式

    // 支持 MDX、RST、AsciiDoc 等
    const SUPPORTED_EXTENSIONS = ['.md', '.mdx', '.rst', '.adoc']

    4. 文档写入

    添加 Tool 支持创建/编辑文档:

    server.registerTool(
    'create_doc',
    {
    // ...
    },
    async ({ path, content }) => {
    await writeFile(path, content)
    await index.updateDoc(path)
    return { content: [{ type: 'text', text: `已创建文档:${path}` }] }
    }
    )

    小结

    通过这个实战项目,我们综合运用了:

    ✅ Tools - 搜索文档、获取结构 ✅ Resources - 暴露文档索引和内容 ✅ Prompts - 预设摘要、解释、问答模板 ✅ Transport - stdio 传输 ✅ 实用工具 - Markdown 解析、全文搜索

    这个文档助手可以作为你自己项目的起点,根据实际需求进行扩展。

    系列总结

    至此,MCP 系列教程全部完成。我们从入门到实战,覆盖了:

    1. MCP 基础概念与架构
    2. Server 开发与 Tools 实现
    3. Resources 数据暴露
    4. Prompts 交互模板
    5. Transport 与部署
    6. Client 集成与 LLM 协作
    7. 完整实战项目

    希望这个系列能帮助你快速上手 MCP,构建更强大的 AI 应用!

    参考资料

    • MCP 官方文档
    • MCP TypeScript SDK
    • 官方 Server 示例
    • gray-matter - Frontmatter 解析
    返回 BlogMCP
    上一篇构建 MCP Client:集成到你的应用下一篇快速上手Nest Cli
    Skip toc
    • 🎯 项目目标
    • 功能设计
      • Tools(AI 可调用的操作)
      • Resources(暴露给 AI 的数据)
      • Prompts(预设交互模板)
    • 项目初始化
      • 目录结构
      • package.json
      • tsconfig.json
    • 核心实现
      • 工具函数:Markdown 处理
      • 工具函数:搜索功能
      • Tools 实现
      • Resources 实现
      • Prompts 实现
      • 主 Server 文件
      • 入口文件
    • 配置与测试
      • 编译项目
      • 配置 Claude Desktop
      • 测试用例
    • 扩展思路
      • 1. 增量索引
      • 2. 语义搜索
      • 3. 支持更多格式
      • 4. 文档写入
    • 小结
    • 系列总结
    • 参考资料
    Table of Contents
    • 🎯 项目目标
    • 功能设计
      • Tools(AI 可调用的操作)
      • Resources(暴露给 AI 的数据)
      • Prompts(预设交互模板)
    • 项目初始化
      • 目录结构
      • package.json
      • tsconfig.json
    • 核心实现
      • 工具函数:Markdown 处理
      • 工具函数:搜索功能
      • Tools 实现
      • Resources 实现
      • Prompts 实现
      • 主 Server 文件
      • 入口文件
    • 配置与测试
      • 编译项目
      • 配置 Claude Desktop
      • 测试用例
    • 扩展思路
      • 1. 增量索引
      • 2. 语义搜索
      • 3. 支持更多格式
      • 4. 文档写入
    • 小结
    • 系列总结
    • 参考资料
    > share on twitter