Spaces:
Running
Running
fix: restore data-language attribute in Shiki-highlighted code blocks
Browse filesShiki's codeToHtml() does not preserve the data-language attribute
from the original <pre> tag. The CSS language label depends on
pre[data-language]::before { content: attr(data-language); },
so the label disappears after Shiki highlighting.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
server.js
CHANGED
|
@@ -85,10 +85,12 @@ function highlightHtmlWithShiki(html, themeName = 'github-light') {
|
|
| 85 |
// Try Shiki highlight
|
| 86 |
if (lang && shikiHighlighter.getLoadedLanguages().includes(lang)) {
|
| 87 |
try {
|
| 88 |
-
|
| 89 |
.replace(/</g, '<').replace(/>/g, '>').replace(/&/g, '&').replace(/"/g, '"'),
|
| 90 |
{ lang, theme: shikiTheme }
|
| 91 |
);
|
|
|
|
|
|
|
| 92 |
return highlighted;
|
| 93 |
} catch (e) {
|
| 94 |
// Fallback to plain pre
|
|
@@ -167,9 +169,9 @@ app.post('/api/generate_pdf', async (req, res) => {
|
|
| 167 |
const htmlSizeMB = (html.length / 1024 / 1024).toFixed(2);
|
| 168 |
const imgCount = imageCount || 0;
|
| 169 |
const imgSizeMB = totalImageSizeMB || 0;
|
| 170 |
-
|
| 171 |
console.log(`[PDF-GEN] [${getElapsed()}] 解析请求完成: HTML ${htmlSizeMB} MB, 图片 ${imgCount} 张 (${imgSizeMB} MB)`);
|
| 172 |
-
|
| 173 |
// 关键修复:移除所有图片的 loading="lazy" 属性
|
| 174 |
// 问题:loading="lazy" 导致视口外的图片在 PDF 中不渲染
|
| 175 |
// 解决方案:https://stackoverflow.com/questions/79156691/puppeteersharp-fails-to-display-base64-encoded-images-in-pdf-output
|
|
|
|
| 85 |
// Try Shiki highlight
|
| 86 |
if (lang && shikiHighlighter.getLoadedLanguages().includes(lang)) {
|
| 87 |
try {
|
| 88 |
+
let highlighted = shikiHighlighter.codeToHtml(codeText
|
| 89 |
.replace(/</g, '<').replace(/>/g, '>').replace(/&/g, '&').replace(/"/g, '"'),
|
| 90 |
{ lang, theme: shikiTheme }
|
| 91 |
);
|
| 92 |
+
// Restore data-language attribute for CSS language label display
|
| 93 |
+
highlighted = highlighted.replace(/<pre\s/, `<pre data-language="${lang}" `);
|
| 94 |
return highlighted;
|
| 95 |
} catch (e) {
|
| 96 |
// Fallback to plain pre
|
|
|
|
| 169 |
const htmlSizeMB = (html.length / 1024 / 1024).toFixed(2);
|
| 170 |
const imgCount = imageCount || 0;
|
| 171 |
const imgSizeMB = totalImageSizeMB || 0;
|
| 172 |
+
|
| 173 |
console.log(`[PDF-GEN] [${getElapsed()}] 解析请求完成: HTML ${htmlSizeMB} MB, 图片 ${imgCount} 张 (${imgSizeMB} MB)`);
|
| 174 |
+
|
| 175 |
// 关键修复:移除所有图片的 loading="lazy" 属性
|
| 176 |
// 问题:loading="lazy" 导致视口外的图片在 PDF 中不渲染
|
| 177 |
// 解决方案:https://stackoverflow.com/questions/79156691/puppeteersharp-fails-to-display-base64-encoded-images-in-pdf-output
|