用途
generate-import-html 是 Adobe helix-website 项目中的一个技能,用于为 AEM Edge Delivery Services 生成结构化 HTML。它从作者分析结果出发,创建纯 HTML 文件,包含块结构,供后续预览使用。该技能由 page-import 技能在第四步调用。
主要能力
- 根据作者分析生成分节结构,每个分节为一个顶层 div。
- 将块以
<div class="block-name">形式呈现,并包含嵌套 div。 - 处理默认内容,如标题、段落、链接、图片。
- 在作者分析中已验证的情况下应用分节元数据块(section-metadata)。
- 生成页面元数据块(metadata block),映射标题、描述、图片、canonical、标签等属性。
- 管理图片文件夹,将图片复制到与 HTML 文件相同的目录。
使用方式
该技能需要以下前置输入:
- 来自 authoring-analysis 的完整作者分析(所有序列均有决策)与分节样式验证。
- 来自 scrape-webpage 的 metadata.json(包含路径与元数据)与 cleaned.html(包含内容)。
- 来自 authoring-analysis 第 3d 步获取的块结构。
生成时只输出分节内容,不生成 <html>、<head>、<body>、<header>、<footer> 或 <main> 标签,也不生成 head 内容(meta 标签、title 等),这些由项目 head.html 提供,AEM CLI 会自动包装 headful 结构。
结构格式示例:
<div>
<!-- Section 1 content -->
</div>
<div>
<!-- Section 2 content with section-metadata if needed -->
<div class="section-metadata">
<div>
<div>Style</div>
<div>grey</div>
</div>
</div>
<!-- Section 2 blocks/content -->
</div>
<div>
<!-- Section 3 content -->
</div>
分节元数据的应用依据 authoring-analysis 第 3e 步的验证决策:当分节提供容器样式时使用 section-metadata;当背景为块特定时跳过 section-metadata。section-metadata div 放在需要样式的分节开头,平台会处理并移除该元数据 div。只迁移可见的正文内容分节,跳过 header、导航、footer(自动生成)。
页面元数据块的处理:除非用户明确要求跳过元数据,否则使用 scrape-webpage 提取的元数据生成元数据块。映射规则包括:标题与首个 H1 比较,相同则省略,不同则包含;描述与首段比较,相同可考虑省略,不同或更具描述性则包含,理想长度 150-160 字符;图片检查 og:image,与首个内容图片相同可考虑省略,自定义社交图片则包含,推荐 1200x630 像素;canonical 指向同页则省略,不同则包含;标签将 article:tag 或 keywords 映射为逗号分隔的 tags 属性。需跳过的属性包括 og:url、og:title、og:description、twitter:title、twitter:description、twitter:image,以及 viewport、charset、X-UA-Compatible(属于 head.html)。元数据块作为最后一个分节 div 追加到 HTML 文件末尾。
图片文件夹管理:图片当前位于 ./import-work/images/,HTML 引用为 ./images/...。需根据 metadata.json 中的 paths.htmlFilePath 确定图片文件夹位置,规则是图片文件夹与 HTML 文件位于同一目录。例如 HTML 为 us/en/about.plain.html,则图片应位于 us/en/images/。复制命令示例:
mkdir -p us/en/images
cp -r ./import-work/images/* us/en/images/
HTML 中已引用 ./images/...,对于同目录文件是正确的,无需修改路径。
保存 HTML 文件:使用 metadata.json 中的 paths.htmlFilePath(如 us/en/about.plain.html)。
适用场景
适用于已具备完整作者分析、分节样式验证、metadata.json、cleaned.html 和块结构,准备生成 HTML 文件用于预览的 AEM Edge Delivery Services 页面导入流程。
限制
- 必须导入页面全部内容,部分导入不可接受。禁止因长度问题截断或跳过分节,禁止总结或缩写内容,禁止使用占位符,禁止因页面过长而省略内容。
- 必须校验 HTML 中的分节数量与 identify-page-structure 识别的分节数量一致,不一致即为错误。
- 强制校验清单包括:分节数量一致、所有序列出现、无截断、完整文本、所有图片、HTML 文件已保存、图片文件夹已复制、图片可访问。任一校验失败必须停止并修复。
- 该技能不生成 html、head、body、header、footer、main 标签及 head 内容。
- 只迁移可见正文内容分节,跳过 header、导航、footer。
输出
- 正确路径下的 HTML 文件(如 us/en/about.plain.html)。
- 同目录下的图片文件夹(如 us/en/images/)。
- 完整内容导入(所有分节)。
- 正确的块结构。
- 按验证应用的分节元数据。
- 包含页面元数据块。
下一步:将 HTML 文件路径传递给 preview-import 技能。