@wll8/md-img

一个强大的 markdown 图片处理工具，支持提取和转换各种格式的图片引用。

安装

npm install -g @wll8/md-img

或者通过 npx 直接使用：

npx @wll8/md-img --help

功能特性

• ✅ 支持多种图片格式提取
• ✅ Base64 图片提取和保存
• ✅ 网络图片引用处理
• ✅ 本地图片路径处理
• ✅ HTML img 标签支持
• ✅ 内联 SVG 提取
• ✅ Markdown 引用式图片
• ✅ HTML Picture 标签支持
• ✅ CSS background-image 支持
• ✅ 单文件和批量处理
• ✅ 命令行工具

使用方法

基本用法

# 处理单个文件，只提取图片
md-img -i example.md

# 处理单个文件，提取图片并生成转换后的 markdown
md-img -i example.md -o converted.md

# 处理整个目录
md-img -i ./docs --imgdir ./images

# 指定输出目录
md-img -i example.md -o ./output --imgdir ./assets

命令行参数

• -i, --input <path> - 指定 markdown 文件或目录路径（默认：当前目录）
• --imgdir <dir> - 图片输出目录（默认：./img）
• -o, --output <path> - 转换后的文件存储路径（可选）

支持的图片格式

Markdown 图片语法

![alt text](./image.jpg)
![alt text](https://example.com/image.png)
![alt text][ref]

[ref]: ./referenced-image.jpg

Base64 图片

![base64](data:image/png;base64,iVBORw0KGgoAAAANSUhEUg...)

HTML img 标签

<img src="./image.jpg" alt="description" />
<img src="https://example.com/image.png" />

内联 SVG

<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100">
  <rect width="100" height="100" fill="#ff0000"/>
</svg>

HTML Picture 标签

<picture>
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="fallback">
</picture>

CSS 背景图片

<div style="background-image: url('./bg.jpg')">Content</div>

本地文件协议

![](file://C:/path/to/image.jpg)

处理规则

• Base64/SVG 图片：使用内容的 MD5 哈希值作为文件名
• URL 图片：使用 filenamify 将完整 URL 转换为安全的文件名
• 本地图片：保持原始文件名，复制到指定目录

输出行为

仅提取模式（无 --output 参数）

• 只提取图片到指定的 --imgdir 目录
• 不修改原始 markdown 文件

转换模式（有 --output 参数）

• 提取图片到指定目录
• 生成新的 markdown 文件，图片引用更新为提取后的路径
• 如果 --output 是目录，会在该目录下生成同名的 markdown 文件

API 使用

import { MarkdownImageProcessor } from '@wll8/md-img'

const processor = new MarkdownImageProcessor()

// 处理文件
const result = await processor.processMarkdownFile('./example.md', {
  outputDir: './images',
  changeRef: true
})

// 处理内容
const content = '![test](data:image/png;base64,iVBORw0...)'
const processed = await processor.processMarkdownContent(content, {
  outputDir: './images',
  changeRef: true
})

许可证

MIT

仓库

https://github.com/wll8/md-img

问题反馈

如有问题或建议，请访问 GitHub Issues