使用说明

MDMCP-Markdown MCP

Markdown MCP是一个更准确、令牌高效的框架，用于构建MCP服务器

一个统一的monorepo，包含Next.js前端应用程序和用于提供markdown文本的MCP（模型上下文协议）服务器。该项目提供了一个完整的解决方案，用于渲染和提供具有动态模板支持和现代web界面的markdown内容。

🚀 快速开始

先决条件

Node.js>=18.0.0
npm（附带Node.js）
Git

安装

克隆存储库：

git clone <repository-url>
cd modelmarkdownprotocol

安装前端依赖项：
```
cd frontend && npm install
```
安装MCP服务器依赖项：
```
cd mcp && npm install
```
在项目根目录安装并启动开发服务器：
```
npm install && npm run dev
```

这将同时启动前端（Next.js）和MCP服务器。前端将在 http://localhost:3000 MCP服务器将在其配置的端口上运行。

📦 打包安装

npm install mdmcp

CLI使用情况

全局安装或使用npx后：

# Start MCP server
mdmcp-server

# Start Next.js frontend server
mdmcp-frontend

🏗️ 项目结构

mdmcp/
├── frontend/                    # Next.js frontend application
│   ├── app/                    # Next.js App Router pages
│   │   ├── layout.tsx         # Root layout component
│   │   ├── page.tsx           # Home page
│   │   ├── ClientRouter.tsx   # Client-side routing
│   │   └── [...slug]/         # Dynamic routing
│   ├── src/                   # Source code
│   │   ├── components/        # Reusable UI components
│   │   │   └── ui/           # Radix UI components
│   │   └── utils/            # Utility functions
│   ├── styles/               # Global styles
│   ├── package.json          # Frontend dependencies
│   ├── next.config.js        # Next.js configuration
│   ├── tailwind.config.js    # Tailwind CSS configuration
│   └── tsconfig.json         # TypeScript configuration
├── mcp/                       # MCP server implementation
│   ├── index.ts              # Main server entry point
│   ├── sessions.ts           # Session management
│   ├── tools/                # MCP tools
│   │   ├── navigate.ts       # Navigation tool
│   │   ├── startHere.ts      # Start here tool
│   │   └── sendRequest.ts    # Request sending tool
│   ├── utils/                # Server utilities
│   ├── package.json          # MCP server dependencies
│   └── tsconfig.json         # TypeScript configuration
├── md/                        # Markdown content and conversion
│   ├── _generated/           # Auto-generated markdown files
│   ├── converter.ts          # Markdown ↔ TypeScript converter
│   ├── convert-all.ts        # Batch conversion script
│   ├── convert-single.ts     # Single file conversion
│   └── *.md                  # Source markdown files
├── dist/                      # Built output (generated)
├── package.json              # Root package configuration
├── tsconfig.json             # Root TypeScript configuration
└── README.md

🛠️ 发展

可用脚本

脚本	描述
`npm run dev`	在开发模式下启动前端和MCP服务器
`npm run dev:frontend`	仅启动Next.js前端
`npm run dev:mcp`	仅启动MCP服务器
`npm run build`	为生产构建这两种服务
`npm run build:frontend`	仅构建前端
`npm run build:mcp`	仅构建MCP服务器
`npm run start`	以生产模式启动前端
`npm run start:frontend`	启动Next.js前端
`npm run start:mcp`	启动MCP服务器
`npm run clean`	清理所有构建输出和依赖关系
`npm run install:all`	为所有软件包安装依赖项
`npm run generate`	将所有TypeScript文件转换为markdown
`npm run generate:single`	转换单个文件
`npm run watch:md`	查看markdown文件以了解更改

开发工作流程

前端开发：
```
cd frontend
npm run dev
```
- 继续运行 http://localhost:3000
- 热重载已启用
- TypeScript类型检查
MCP服务器开发：
```
cd mcp
npm run dev
```
- 用途 tsx 用于执行TypeScript
- 文件更改时自动重新启动

Markdown内容开发：

# Watch for markdown changes
npm run watch:md

# Generate all markdown files
npm run generate

📝 Markdown支持和格式

MDMCP支持具有高级功能的丰富标记格式：

标准Markdown

标题： # H1, ## H2, ### H3等等。
重点： *italic*, **bold**, ***bold italic***
列表： 已订购(1.)无序(-, *)
链接： [text](route_id)
图像： ![alt](src)
代码： `inline` 和 code blocks
区块链报价： > quote
桌子： GitHub风格的Markdown表
水平规则： ---

扩展功能

GitHub风格Markdown（GFM）

罢工： ~~deleted text~~
任务列表： - [x] completed / - [ ] todo
对齐的表格
自动route_id链接
断线： 尊重，不需要双倍空间

MDX支持

React组件： 在markdown中嵌入React组件
JSX： 在markdown中使用JSX语法
进口： 导入和使用组件

代码语法高亮显示

支持以下语法高亮显示：

JavaScript/TypeScript
HTML/CSS
对象符号
Bash/Shell
python
还有更多的语言

模板变量

带有模板变量的动态内容：

Hello {{name}}, welcome to {{project}}!

转换为TypeScript函数：

export function template({name, project}: {name: string, project: string}): string {
  return `Hello ${name}, welcome to ${project}!`;
}

Markdown转换系统

该项目包括一个复杂的降价↔ TypeScript转换系统：

TypeScript到Markdown

从TypeScript导出中提取模板文本
正确处理逃逸的回溯
保持格式和结构

Markdown转TypeScript

将markdown转换为TypeScript模板函数
自动检测模板变量({{variable}})
为模板化内容生成类型安全函数
为静态内容创建持续导出

使用示例

将markdown转换为TypeScript：

npm run generate:single -- path/to/file.md

将TypeScript转换为markdown：

npm run generate:single -- path/to/file.ts

批量转换：

npm run generate

🏭 生产

生产大楼

# Build everything
npm run build

# Or build individually
npm run build:frontend
npm run build:mcp

生产部署

前端（Next.js）：
```
npm run start:frontend
```
MCP服务器：
```
npm run start:mcp
```

使用内置二进制文件：

# After npm pack and install
mdmcp-frontend
mdmcp-server

🧩 技术栈

前端技术

Next.js 15 -带有App Router的React框架
反应18 -具有最新功能的UI库
TypeScript 5+ -类型安全和开发人员经验
顺风CSS -实用程序优先的CSS框架
Radix UI -无样式、可访问的UI组件
MDX -支持JSX的Markdown
React Markdown -使用自定义组件的Markdown渲染
备注GFM -GitHub风格的Markdown支持
Lucide反应 -图标库

后端技术

模型上下文协议SDK -MCP服务器实现
Express.js 5 -Web应用程序框架
TypeScript -类型安全服务器开发
萨德 -运行时类型验证
Node.js 18+ -JavaScript运行时

开发工具

多伦多证券交易所 -Node.js的TypeScript执行
同时 -同时运行多个命令
乔基达尔 -文件监视以进行开发
ESLint -代码linting
自动预混合器 -CSS供应商前缀

🔧 配置

环境变量

创建 .env.local 在前端目录中：

# Add your environment variables here
NEXT_PUBLIC_API_URL=http://localhost:8080

TypeScript配置

该项目使用monorepo TypeScript设置：

根 tsconfig.json 用于共享配置
前端特定的TypeScript配置
MCP服务器特定的TypeScript配置

顺风CSS

完全配置了：

自定义配色方案
响应式设计工具
组件变体
动画支持

🤝 贡献

分叉存储库
创建要素分支： git checkout -b feature/amazing-feature
进行更改
运行测试： npm test
提交您的更改： git commit -m 'Add amazing feature'
推到分支： git push origin feature/amazing-feature
打开拉取请求

📄 许可证

MIT许可证-有关详细信息，请参阅许可证文件

🆘 支持

问题： 在GitHub Issues上报告错误和请求功能
文档： 代码库中提供了全面的文档
社区： 加入GitHub讨论

内置于❤️ 使用Next.js、TypeScript和模型上下文协议