neenjaw/mermaid

Puppeteer与Mermaid CLI集成镜像

镜像概述

该Docker镜像基于Node.js 13.13.0构建，集成了Puppeteer（网页自动化工具）和Mermaid CLI（图表生成工具），并预装Google Chrome浏览器，提供完整的网页渲染和自动化环境。适用于需要通过代码实现网页操作、截图、PDF生成及Mermaid图表渲染的场景。

核心功能和特性

• 基础环境：基于Node.js 13.13.0，提供稳定的JavaScript运行环境
• 浏览器支持：预装Google Chrome Stable，支持完整的网页渲染
• 自动化工具：集成Puppeteer，支持网页自动化控制、截图、PDF生成等操作
• 图表生成：集成Mermaid CLI，支持将Mermaid语法转换为图片或PDF格式图表
• 安全配置：创建专用用户pptruser，优化权限管理，支持安全运行

使用场景和适用范围

• 网页自动化测试与截图
• 动态网页内容抓取与PDF导出
• Mermaid图表（流程图、时序图等）批量生成
• 基于浏览器环境的JavaScript自动化任务
• CI/CD流程中的网页渲染或图表生成步骤

使用方法和配置说明

构建镜像

bash
# 假设Dockerfile保存路径为当前目录
docker build -t puppeteer-mermaid .

运行容器

基础运行命令：

bash
docker run -it --rm puppeteer-mermaid

挂载本地目录（用于输入输出文件）：

bash
docker run -it --rm -v $(pwd):/workspace puppeteer-mermaid

环境变量

若设置PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true，需在代码中指定Chrome路径：browser.launch({executablePath: 'google-chrome-stable'})

权限注意事项

镜像创建了专用用户pptruser（UID/GID未指定），并对/home/pptruser和/node_modules目录设置了权限。如需以非root用户运行，可通过--user pptruser指定：

bash
docker run -it --rm --user pptruser puppeteer-mermaid

使用示例

1. 使用Puppeteer生成网页截图

创建测试脚本capture.js：

javascript
const puppeteer = require('puppeteer');

(async () => {
  const browser = await puppeteer.launch({
    executablePath: 'google-chrome-stable',
    args: ['--no-sandbox', '--disable-setuid-sandbox']
  });
  const page = await browser.newPage();
  await page.goto('https://example.com');
  await page.screenshot({ path: '/workspace/example.png' });
  await browser.close();
})();

运行脚本：

bash
docker run -it --rm -v $(pwd):/workspace puppeteer-mermaid node /workspace/capture.js

2. 使用Mermaid CLI生成图表

创建Mermaid文件diagram.mmd：

mermaid
graph TD
    A[Start] --> B{Is it working?};
    B -->|Yes| C[OK];
    B -->|No| D[Try again];

生成PNG图表：

bash
docker run -it --rm -v $(pwd):/workspace puppeteer-mermaid mmdc -i /workspace/diagram.mmd -o /workspace/diagram.png