Skip to content

Markdown 导出

📋 功能概述

优化后的 export-markdown.js 提供了更加通用的 markdown 导出功能，适用于知乎、掘金等第三方平台。

✨ 主要改进

1. Hugo Shortcode 处理

  • Alert/Notice/Callout: 转换为 markdown 引用格式
> **INFO**
>
> 这是一个信息提示
  • Tab/Tabs: 转换为标题和分割线格式
### 标签名称

内容...

---
  • 其他 Shortcode: 自动删除所有 Hugo 特定的 shortcode 语法

2. 图片链接优化

  • 自动转换相对路径图片到 Cloudflare R2
  • 统一图片格式为 PNG
  • 原路径：![alt](./image.jpg)
  • 转换后：![alt](https://assets.jimmysong.io/images/blog/article-name/image.png)

3. 图片属性清理

自动删除 Hugo 特定的图片属性配置：

![图片](image.png)
{width=1000 height=1000}  <!-- 这行会被删除 -->

4. 内容格式化

  • 删除 HTML 注释
  • 清理多余空行
  • 修复列表格式
  • 删除 Hugo 引用语法 {{< ref >}}
  • 移除 Mermaid 代码块（大多数第三方平台不支持）

🚀 使用方法

  1. 在博客页面点击"导出 Markdown"按钮
  2. 文件会自动下载到本地
  3. 控制台会显示图片上传信息

📁 图片上传

使用 rclone 脚本

# 配置 rclone (仅需一次)
rclone config

# 使用脚本上传图片
./scripts/upload-images.sh /path/to/content/zh/blog/article-name blog/article-name

使用 Cyberduck

  1. 连接到 Cloudflare R2
  2. 导航到 assets/images/ 目录
  3. 创建对应的博客路径文件夹
  4. 上传并转换图片为 PNG 格式

🎯 支持的平台

优化后的 markdown 文件适用于：

  • ✅ 知乎
  • ✅ 掘金
  • ✅ CSDN
  • ✅ 博客园
  • ✅ 简书
  • ✅ 其他标准 markdown 平台

📝 导出文件格式

> 文章描述
>
> 阅读原文请转到：https://jimmysong.io/blog/article

文章内容...

---

**本文首发于：** https://jimmysong.io/blog/article

🔧 开发说明

主要函数：

  • removeImageAttributes(): 删除图片属性
  • convertShortcodes(): 转换 Hugo shortcode
  • convertImageLinks(): 转换图片链接
  • convertRelativeLinks(): 转换相对链接
  • cleanMarkdownContent(): 清理内容格式

💡 注意事项

  1. 导出前确保图片已上传到 Cloudflare R2
  2. 检查控制台输出的路径信息
  3. 验证第三方平台的 markdown 渲染效果
  4. 必要时手动调整格式细节