MacOS下Puppeteer将HTML转PDF时绝对路径保存失败问题

问题根源 #

报错ENOENT: no such file or directory通常出自两个原因：

• 目标目录不存在，Puppeteer不会自动创建缺失的层级目录
• 路径写法不符合Node.js/Puppeteer的要求（比如错误使用file://前缀、未解析~用户目录）

解决方案 #

1. 先确保目标目录存在 #

在生成PDF前，检查并创建目标目录（不存在则自动创建），用fs.mkdirSync配合递归参数实现：

import fs from 'fs';
import path from 'path';

// 定义目标目录
const PDF_TARGET_DIR = '/Users/me/TestDirectory';

// 递归创建目录（包括不存在的父级目录）
if (!fs.existsSync(PDF_TARGET_DIR)) {
  fs.mkdirSync(PDF_TARGET_DIR, { recursive: true });
}

2. 使用标准绝对路径写法 #

Puppeteer的page.pdf()的path参数接受本地文件系统的绝对路径，不需要file://前缀，也不要直接用~（Node.js默认不会解析波浪线为用户主目录）。推荐用path.resolve构建可靠路径：

修改后的完整代码 #

import puppeteer from 'puppeteer';
import fs from 'fs';
import path from 'path';

export const HTML_PATH = path.resolve(
  "/Users/me/dev/script/src/template/index.html",
);

private async convertHtmlToPdf(config: Config, name: string) {
  const browser = await puppeteer.launch({
    headless: "new",
  });

  const page = await browser.newPage();

  await page.setContent(fs.readFileSync(HTML_PATH, "utf-8"), {
    waitUntil: "domcontentloaded",
  });

  await page.emulateMediaType("screen");

  // 处理目标目录和PDF路径
  const pdfDir = '/Users/me/TestDirectory';
  if (!fs.existsSync(pdfDir)) {
    fs.mkdirSync(pdfDir, { recursive: true });
  }
  const pdfPath = path.resolve(pdfDir, `${name}-${Math.round(Math.random() * 50)}.pdf`);

  const pdf = await page.pdf({
    format: "A4",
    path: pdfPath,
    printBackground: true,
  });

  await browser.close();
}

补充说明 #

• 如果需要基于用户主目录动态构建路径，不要写~/TestDirectory，改用process.env.HOME拼接：

  const pdfDir = path.resolve(process.env.HOME, 'TestDirectory');
  

• 始终用path.resolve或path.join处理路径，避免手动拼接字符串导致的分隔符、层级错误，同时保证跨平台兼容性。

内容的提问来源于stack exchange，提问作者Codex