a1-migration

A1 设计系统迁移

适用场景

• 将 Angular 应用从 NDBX／旧设计系统迁移到 One Allianz（A1）设计系统
• 应用 One Allianz 主题（spacious、compact 或 dense）
• 将 nx-circle-toggle／nx-circle-toggle-group 替换为 nx-tile／nx-tile-group
• 将信息按钮替换为弹出层，以使用新的 NxInfoIconComponent
• 将布局从居中对齐调整为左对齐（A1 标准）
• 调整 nx-small-stage 组件、眉题和强调色标题

如何应用更改

• 如果需要 CSS，请将其添加到组件的 CSS 文件中。如果组件是独立组件，请将 CSS 添加到 @Component 装饰器的 styles 数组中。
• 将样式定义写入组件的样式文件。请勿在 HTML 模板中使用内联样式。

---

重要提示： 开始前，请告知用户此技能的版本为“0.1.5”，并说明它处于 beta 阶段。这对跟踪和后续更新很重要。

第 1 步：应用 A1 主题

重要提示： 检查是否已安装软件包 @allianz/ngx-brand-kit。

• 如果未安装，请勿尝试安装，也不要询问用户是否要安装；跳过此步骤并继续第 2 步。
• 如果已安装，请按以下过程继续。

过程

1. 如果未指定主题，请询问用户想要哪种主题：spacious、compact 还是 dense。

• spacious 适用于面向终端客户的应用，留白更多，触控目标更大
• compact 适用于需要更高信息密度的内部工具和仪表板
• dense 适用于需要最高信息密度的数据密集型应用（例如表格、分析）

2. 在项目根目录（angular.json 所在的位置）运行 schematic：

   ng g @allianz/ngx-brand-kit:apply-a1-theme --type=<THEME>
   

---

第 2 步：将圆形切换项迁移为平铺项

技术栈：Angular 独立组件、TypeScript、@allianz/ng-aquila

导入

import { NxTileComponent, NxTileGroupComponent } from '@allianz/ng-aquila/tile';

如果在独立组件中使用，请将 NxTileComponent, NxTileGroupComponent 添加到组件的 imports 数组中。

判定规则

场景	操作
nx-circle-toggle 不在分组中	多选 → 使用 nx-tile-group [value]="arrayOfValues"
nx-circle-toggle 位于 nx-circle-toggle-group 中	单选 → 使用 nx-tile-group [value]="selectedValue"
存在 circleText 属性	移除它；添加 ``

选择／表单模式

之前（基于 checked）：

<nx-circle-toggle-group>
  <nx-circle-toggle
    [checked]="sel==='a'"
    value="a"
    label="Label A"
    icon="icon-name"
  ></nx-circle-toggle>
  <nx-circle-toggle
    [checked]="sel==='b'"
    value="b"
    label="Label B"
    icon="icon-name"
  ></nx-circle-toggle>
</nx-circle-toggle-group>

之后（基于分组的 value）：

<nx-tile-group [value]="sel">
  <nx-tile value="a" label="Label A" icon="icon-name"></nx-tile>
  <nx-tile value="b" label="Label B" icon="icon-name"></nx-tile>
</nx-tile-group>

重要提示：请勿在 <nx-tile> 内放置内容。仅使用 label、value 和 icon 属性。

布局规则

找到的布局	操作
没有包装元素，也没有布局 CSS	直接替换分组；无需额外布局
nxLayout／nxRow／nxCol 网格	根据最小的 nxCol 数值推导 maxColumns：12 ÷ 最小值 = maxColumns。移除网格包装元素。
自定义 CSS	将其转换为 nx-tile-group 上的 [maxColumns]；只有在自动网格不足以满足需求时才复制 CSS
总共 2–3 个平铺项	将 nx-tile-group 包装在 nxCol="12,12,6" 中（半宽）

对于找到的每一处，请输出简短的判定记录：原有内容、选择的方案及原因。

---

第 3 步：将信息弹出窗口迁移为新的信息图标组件

1. 识别带有弹出层的信息按钮： 查找会触发弹出层且内部只有信息图标的按钮（例如带有指令 nxPopoverTrigger 的按钮）。
2. 替换为 NxInfoIconComponent： 使用新组件以确保样式和行为一致。
3. 示例：

<nx-info-icon
  nxFormfieldAppendix
  buttonAriaLabel="Additional information"
  popoverDirection="bottom"
  popoverWidth="300px"
>
  <span>
    This is an info icon with a popover. Click the icon to see additional information. Sadipscing
    elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam
    voluptua.
  </span>
</nx-info-icon>

以及对应的导入：

import { NxInfoIconComponent } from '@allianz/ng-aquila/info-icon';

如果在独立组件中使用，请将 NxInfoIconComponent 添加到组件的 imports 数组中。

4. 重要提示： 对于 位于 Formfield（<nx-formfield>）内部的信息按钮，请勿使用这个独立的 <nx-info-icon> 替换方案；请改用下文的 第 3.1 步迁移。第 3 步仅涵盖在表单字段之外触发弹出层的独立信息按钮。

步骤 3.1：表单字段信息图标 → nxLabelInfo 投影插槽

表单字段提供了用于标签信息图标的内容投影插槽：将信息图标组件投影到表单字段中，并使用 nxLabelInfo 指令标记。它会显示在标签旁边（在 A1 中，标签始终浮动）。将旧的变通方案——手动将信息图标/弹出框放在表单字段的 nxFormfieldAppendix 插槽中——迁移到此插槽。

1. **识别：**包含以下任一内容的 <nx-formfield>，其中该内容位于 nxFormfieldAppendix 插槽中：
   • 现有的 <nx-info-icon nxFormfieldAppendix>…</nx-info-icon>，或
   • 带有 nxPopoverTrigger（或 [nxPopoverTriggerFor]）的按钮，按钮中包含信息图标（例如 <nx-icon name="info-circle-o">），其弹出框仅用于说明该字段。
2. **替换：**在表单字段内放入 <nx-info-icon nxLabelInfo>…</nx-info-icon>，并将帮助内容直接投影到其中（纯文本或结构化标记）。移除旧的附加区域按钮/弹出框标记。由于信息图标现在是一个投影组件，你可以直接在该元素上完全控制其 API（popoverDirection、popoverWidth、popoverModal、buttonAriaLabel 等），也可以将自定义/特定实体的信息图标实现投影到同一插槽中。
3. **也适用于自定义标签：**无论标签来自 label 字符串输入，还是投影的 <nx-formfield-label>，该插槽都会渲染图标。不要将信息内容移到 <nx-formfield-label> 中。

之前（附加区域变通方案——按钮 + 弹出框）：

<nx-formfield label="Email">
  <input nxInput [(ngModel)]="email" />
  <button
    nxFormfieldAppendix
    nxIconButton="tertiary small"
    [nxPopoverTriggerFor]="emailInfo"
    nxPopoverTrigger="click"
    type="button"
    aria-label="More information"
  >
    <nx-icon name="info-circle-o" size="s" aria-hidden="true"></nx-icon>
  </button>
</nx-formfield>

<nx-popover #emailInfo>
  <div style="max-width: 300px">We only use your email to send policy documents.</div>
</nx-popover>

之后（字符串内容）：

<nx-formfield label="Email">
  <input nxInput [(ngModel)]="email" />
  <nx-info-icon nxLabelInfo>We only use your email to send policy documents.</nx-info-icon>
</nx-formfield>

之后（结构化内容，直接投影——无需 ng-template）：

<nx-formfield label="Email">
  <input nxInput [(ngModel)]="email" />
  <nx-info-icon nxLabelInfo>
    <p nxCopytext>We only use your email to send policy documents.</p>
    <a nxLink href="/privacy">Privacy policy</a>
  </nx-info-icon>
</nx-formfield>

添加信息图标导入（如果是独立组件，也要将其添加到 imports 中）。nxLabelInfo 指令随标签/表单字段模块提供：

import { NxInfoIconComponent } from '@allianz/ng-aquila/info-icon';

**注意：**手动使用 nxFormfieldAppendix 插槽仍然有效，框架也没有移除它；但对于字段级帮助，建议使用 nxLabelInfo 插槽，这样图标在 A1 中会始终与标签对齐。

约定：优先使用内容投影，而非透传输入

在一个组件中包装另一个组件时，优先使用内容投影，而非添加透传输入。不要将子组件的输入映射到其包装组件上（例如，表单字段有意不提供 infoIconContent 输入）；应投影子组件（<nx-info-icon nxLabelInfo>），并让它拥有自己的 API。这样可以保持统一的编写方式，避免包装组件与子组件不同步，也让使用者能够替换为自己的实现。仅在组件自身拥有一组有限选项的标量配置（size、disabled、label）上使用 @Input()。

---

步骤 4：更新布局 — 左对齐

A1 全面采用左对齐，以确保无障碍性和一致性。

检查清单

1. **取消行居中：**将 rowJustify="center" 改为 rowJustify="start"，或直接移除。
2. **取消文本居中：**移除标题和段落上的 class="text-center"、style="text-align: center" 及类似设置。
3. 底部导航按钮（Back / Next）：
   • 必须右对齐（rowJustify="end"）
   • 必须并排显示（位于同一个 nxRow 中，而非堆叠在不同的行中）
   • 必须使用句首字母大写形式（“Back”“Next”），而非全大写
   • nxCol 只接受数字——注意：nxCol="auto" 会导致问题；请使用 nxCol="12"、nxCol="12,12,6" 或类似值
   • nxCol 相关信息：断点定义格式为 nxCol="<tiny>, <small>, <medium>, <large>, <xlarge>, <2xlarge>, <3xlarge>"
   • 必须在行内垂直居中——如果使用 nxRow，请添加 rowAlignItems="center"。
4. **外边距 / 内边距：**移除 margin: auto 和水平居中设置，并确保内容与左边缘对齐。

垂直间距调整

• 重要：如果未安装 ngx-brand-kit，请跳过此步骤，继续执行下方的「标题尺寸」。以下间距值依赖 A1 品牌套件中的 CSS 变量，因此如果未安装，请保持间距不变。
• 查找横跨页面全宽的分隔线（<hr>、nx-divider、nxCol="12" class="section-divider" 或类似元素），并在其上方和下方添加垂直间距。使用 var(--semantic-gap-all-static-1600) 作为此间距，以确保符合 A1 设计标准。
• 独立使用（位于其他组件之外）的标题下方应留出间距。请使用以下对应关系：
  • nxHeadline size="3xl" → var(--semantic-gap-all-static-1200)
  • nxHeadline size="2xl" → var(--semantic-gap-all-static-1000)
  • nxHeadline size="xl" → var(--semantic-gap-all-static-800)
• 如果标题下方的元素带有顶部间距（例如 margin-top 或 padding-top），请移除该间距，避免间距重复；或从中减去标题间距。

标题尺寸

层级规则——在应用映射表后执行，必要时优先于映射表： 下方映射表是起点，并非最终结果。应用映射后，请检查最终尺寸是否在页面上形成清晰的视觉层级。如果主要章节标题（例如作为页面章节主标题的 <h2>）映射到 s 或 m 这样较小的尺寸，请覆盖映射值以恢复层级。若页面中的 h1 使用 size="3xl"，其主要 h2 章节应使用 size="2xl"，子章节应使用 size="xl"，依此类推——无论旧的指定值是什么。

• 如果找到带有类型指定值的 nxHeadline（例如 <h1 nxHeadline="page">），请转换为 size 属性。例如，<h1 nxHeadline="page"> 应改为 <h1 nxHeadline size="3xl">。确保 nx-small-stage 中的主标题使用 size="3xl"，以符合 A1 标准。

旧指定值	size 属性	用途
nxHeadline="page-bold-caps"	nxHeadline size="4xl"	超大页面标题，仅用于营销页面，不用于产品界面
nxHeadline="page"	nxHeadline size="3xl"	页面主标题
nxHeadline="section"	nxHeadline size="2xl"	章节标题
nxHeadline="subsection-large"	nxHeadline size="xl"	大型子章节标题
nxHeadline="subsection-medium"	nxHeadline size="l"	中型子章节标题
nxHeadline="subsection-small"	nxHeadline size="m"	小型子章节标题
nxHeadline="subsection-xsmall"	nxHeadline size="s"	超小型子章节标题

应用表格后，请检查结果是否符合上下文。主要的 <h2> 章节标题不应仅仅因为旧代码使用了 subsection-xsmall，就变成 size="s"。请将其调整到页面层级中的正确级别。

---

第 5 步：调整小型舞台

5.1 副标题 → 眉题

将 nx-small-stage 内的任何 <p nxCopytext="large">Subline</p> 移至 <h1> 上方，作为眉题：

<nx-eyebrow size="s">Subline Text</nx-eyebrow>
<h1 nxHeadline size="3xl">...</h1>

对于 nxHeadline size 3xl 及更小的标题，眉题请使用 size="s"。如果用户需要大于 3xl 的 nxHeadline，眉题请使用 size="m"。

import { NxEyebrowComponent } from '@allianz/ng-aquila/eyebrow';

如果用于独立组件，请将 NxEyebrowComponent 添加到组件的 imports 数组中。

5.2 标题部分着色（必需）

务必使用强调色的 span 包裹 <h1> 中最有意义的词语或短语。这是 nx-small-stage 标题必须遵循的 A1 设计标准——不得跳过。请选择语义权重最高的词语或短语（产品、动作或主题，而非「你的」或「和」等填充词）。

<h1 nxHeadline size="3xl">Enter your <span [nx-accent-color]="'aqua'">property details</span></h1>

import { NxAccentColorComponent } from '@allianz/ng-aquila/text';

如果用于独立组件，请将 NxAccentColorComponent 添加到组件的 imports 数组中。

5.3 标题大小

• 移除 HTML 标题元素中的 nxHeadline 赋值（例如 <h1 nxHeadline="page">），并将所有小型舞台标题替换为 <h1 nxHeadline size="3xl">。确保 nx-small-stage 中的主标题使用 size="3xl"，以保持 A1 一致性。

---

步骤 6：迁移文件上传器

6.1 选择文件按钮

打开文件选择器的按钮（nxFileUploadButton）在 A1 中有所变化：

属性	NDBX（旧版）	A1
nxButton 变体	"primary"	"secondary"
图标	plus	arrow-upload
标签	"Add File"	"Choose File"

之前（NDBX）：

<button nxButton="primary" type="button" nxFileUploadButton>
  <nx-icon name="plus" class="nx-margin-right-2xs" aria-hidden="true"></nx-icon>
  Add File
</button>

之后（A1）：

<button nxButton="secondary" type="button" nxFileUploadButton>
  <nx-icon name="arrow-upload" class="nx-margin-right-2xs" aria-hidden="true"></nx-icon>
  Choose File
</button>

如果图标使用 nxIconPositionStart 而非边距类来设置位置，请保留该定位属性，只替换图标名称。

6.2 上传按钮 — 未选择文件时隐藏

对于手动上传流程（即上传器具有 [uploader] 绑定，且上传按钮使用 [nxFileUploadTriggerFor] 或在点击时触发上传），尚未选择任何文件时必须完全隐藏上传按钮。A1 移除了禁用状态，改用条件渲染。

之前（NDBX）— 始终显示，文件为空时禁用：

<button
  nxButton="secondary small"
  [nxFileUploadTriggerFor]="documentUpload"
  [disabled]="!documentUpload.value?.length"
  type="button"
>
  Upload
</button>

之后（A1）— 有文件后才显示：

@if (documentUpload.value?.length) {
  <button
    nxButton="primary"
    [nxFileUploadTriggerFor]="documentUpload"
    type="button"
  >
    Upload files
  </button>
}

上传按钮（主要操作）使用 nxButton="primary"，文件选择器按钮使用 nxButton="secondary"。

6.3 自动上传流程

对于自动上传（文件在选中后立即上传，无单独的上传按钮），无需显示或隐藏上传按钮。只需应用 6.1 中的选择文件按钮变更。

决策清单

对于找到的每个 nx-file-uploader：

1. 更新 nxFileUploadButton：将 primary 替换为 secondary，将图标 plus 替换为 arrow-upload，将标签 "Add File" 替换为 "Choose File"。
2. 查找上传触发按钮（[nxFileUploadTriggerFor] 或手动触发上传的按钮）。
   • 如果该按钮存在且不是自动上传流程：用 @if (uploaderRef.value?.length) 包裹，移除 [disabled]，并将变体改为 primary。
   • 如果没有上传按钮（自动上传），则跳过第 2 步。

步骤 7：迁移上下文菜单选择

nxContextMenuItem 现在内置单选／多选功能。应将手动实现的模式迁移到新 API，这些模式会将 selectable、<nx-icon name="check">、显式的 role="menuitemradio|menuitemcheckbox" 和 [attr.aria-checked] 组合使用。

检测

查找符合以下任一特征的 nxContextMenuItem 用法：

• 存在 selectable（裸属性），并且根据选中值有条件地渲染手动添加的 <nx-icon name="check">。
• 手动在菜单项上设置 role="menuitemradio" 或 role="menuitemcheckbox"。
• 手动在菜单项上绑定 [attr.aria-checked]。

替换

之前：

<button
  nxContextMenuItem
  selectable
  type="button"
  (click)="selectedLanguage = o.value"
  role="menuitemradio"
  [attr.aria-checked]="selectedLanguage === o.value ? 'true' : 'false'"
>
  @if (selectedLanguage === o.value) {
    <nx-icon aria-hidden="true" name="check" nxIconPositionStart></nx-icon>
  }
  {{ o.label }}
</button>

之后：

<button
  nxContextMenuItem
  selectable="single"
  [selected]="selectedLanguage === o.value"
  type="button"
  (click)="selectedLanguage = o.value"
>
  {{ o.label }}
</button>

多选菜单使用 selectable="multi"；如果菜单应在切换选项时保持打开状态，则保留 disableCloseOnSelect。移除所有手动添加的 <nx-icon name="check">、role 和 [attr.aria-checked] 绑定——组件会为你渲染指示器并设置角色。

说明

• 不带值的旧版 selectable 仍然有效，并会被视为 "true"。但这是旧版行为。与旧版本相比，行为有所变化：旧版本中，裸属性只会调整内边距。如果模板依赖旧有的纯样式行为，且不需要单选角色，请设置 [selectable]="null"（或移除该属性）。
• 完成此步骤后，将 "context-menu-selection" 添加到 package.json 中的 a1Migration.steps 数组。

步骤 8：将 Copytext 迁移到 Body / Utility Text

A1 将文本分为正文文本（用户作为内容阅读的散文）和功能文本（用于标记或注释 UI、与基线网格对齐的文本）。NDBX copytext 没有这一区分，因此替换前必须对每个 nxCopytext 进行分类。正文文本是默认选择；功能文本是例外，需要说明选择理由。

import { NxBodyTextComponent, NxUtilityTextComponent } from '@allianz/ng-aquila/text';

如果在独立组件中使用，请将所用组件添加到组件的 imports 数组中。

检测

在模板中查找 nxCopytext，包括裸属性（<p nxCopytext>）和字符串形式（<p nxCopytext="small">、<p nxCopytext="medium negative">）。还要查找旧版 CSS 类 nx-copy、nx-copy--small、nx-copy--medium、nx-copy--large 和 nx-copy--negative。

使用哪个组件

默认使用 nxBodyText。 在 A1 中，每种 nxCopytext 尺寸都会映射到 body 令牌，因此 nxBodyText 能精确复现当前的排版样式——字体大小、字体系列、字重、字间距和行高。颜色是唯一可能变化的属性，详见下文“颜色”。尺寸与此选择无关——nxCopytext="small" 段落应迁移为 nxBodyText size="s"，而不是功能文本。

只有当某个实例符合以下情况之一时，才切换到 nxUtilityText：

选择功能文本的理由	示例
必须与相邻控件或图标对齐的单行文本	复选框、开关、单选按钮或徽章旁的标签
密集且与网格对齐的布局中的文本	表格单元格、列表行、键值对、工具栏
表单或字段标签、说明文字、提示、辅助文本	<label>、字段描述
需要更粗的字重（attention）	强调的元数据、状态文本

只有行高可能不同——字体大小、字体系列和默认字重始终相同。功能文本的行高固定为 4pt 基线网格，以便文本与组件框对齐；正文文本在某些尺寸下的行高会偏离网格，以提高多行文本的可读性。行距对比如下（正文 → 功能）：

尺寸	宽松	紧凑 / 密集
s	22px → 20px	20px → 16px
m	相同（24px）	22px → 20px
l	相同（28px）	相同（24px）

需要明确说明两点：

• 行距变紧时，功能文本中的多行正文会显得局促。如果文本会换行，无论尺寸如何，都应使用正文文本。
• 上表显示行高发生变化时，选择功能文本会改变渲染效果——这是有意的设计修正，而不是无变化的重构。请在决策日志中注明，以便评审者预期会看到差异。上表显示“相同”时，替换前后的像素效果完全一致，无需标记。

如果某个实例确实难以判断，可以问自己：脱离周围 UI 单独阅读时，这段文本是否仍然有意义？是 → 正文文本。否 → 功能文本。如果仍不确定，请保留正文文本。

颜色

nxCopytext 本身不设置颜色——它会继承自祖先元素。两个新组件都会在宿主元素上设置自身颜色，因此只有文本原本继承默认文本颜色时，迁移才不会影响颜色。

检查该实例当前呈现的颜色：

情况	操作
没有祖先元素或本地规则设置 color	无需操作——令牌颜色与继承的颜色一致
祖先元素设置了深色 / 反转背景及其自身的浅色 color	添加 inverse
本地规则或祖先元素规则设置了有意指定的自定义 color	保留该规则；如果原本是柔和的灰色，则选择 type="secondary"；并标记为视觉变化

只有第一行的效果与原先完全一致。其他两种情况都会改变渲染效果，因此请记录。

尺寸映射

旧设置	size
nxCopytext="small" / .nx-copy--small	size="s"
nxCopytext="medium" / nxCopytext（默认）/ .nx-copy--medium	size="m"
nxCopytext="large" / .nx-copy--large	size="l"

nxCopytext="normal" 是旧的默认值，同样映射为 size="m"。

其他属性

旧属性	新属性
negative（例如 nxCopytext="small negative"）	inverse
在元素的 CSS 中手动设置 font-weight: 600 / 700	attention（仅限工具文本）
.nx-copy 旧版类	移除；组件会设置自己的类

示例

之前：

<p nxCopytext="medium">
  On the insurance side, Allianz is the market leader in the German market.
</p>
<p nxCopytext="small">
  Your policy covers damage caused by fire, storm and tap water, including any
  follow-up costs incurred while the damage is being repaired.
</p>
<p nxCopytext="small negative">All prices include VAT.</p>
<td nxCopytext="small">12.05.2026</td>
<label nxCopytext="small" for="iban">IBAN</label>

之后：

<p nxBodyText size="m">
  On the insurance side, Allianz is the market leader in the German market.
</p>

<p nxBodyText size="s">
  Your policy covers damage caused by fire, storm and tap water, including any
  follow-up costs incurred while the damage is being repaired.
</p>
<p nxBodyText size="s" inverse>All prices include VAT.</p>

<td nxUtilityText size="s">12.05.2026</td>

<label nxUtilityText size="s" for="iban">IBAN</label>

注意事项

• 两个组件都是属性选择器，因此请保留语义元素（<p>、<span>、<dd> 等）。
• nxCopytext 仍然有效，且不会被移除；请逐步迁移，并在文件中最后一个实例移除后，删除 NxCopytextModule / NxCopytextComponent 导入。
• 两个组件仅适用于 A1。尚未完成步骤 1 的应用请勿执行此步骤。
• 对每个实例，输出简短的决策记录：文本内容、属于正文还是工具文本，以及原因。当工具文本选择实际改变字重时，请标记为视觉变更——任何密度下的 size="s"，或紧凑 / 密集模式下的 size="m"，都需进行审核。当实例需要做颜色决策时（参见“颜色”），也请标记为视觉变更。请从 package.json 中的 a1Migration.theme 读取密度；或者从 angular.json 中构建 styles 数组的 allianz-one*.css 条目读取（allianz-one.css = 宽松）。如果两者都不存在，请询问用户。
• 完成此步骤后，将 "text" 追加到 package.json 的 a1Migration.steps 数组中。

---

迁移跟踪

完成每个步骤后，请记录迁移情况，以便通过 GitHub 搜索跟踪各团队的采用情况。

package.json 中的项目级元数据

在步骤 1（应用主题）之后，将 a1Migration 键添加到 package.json。完成后续每个步骤后，将步骤名称追加到 steps 数组中：

"a1Migration": {
  "skillVersion": "0.1.5",
  "appliedAt": "YYYY-MM-DD",
  "theme": "<spacious|compact|dense>",
  "steps": ["theme"]
}

完成步骤后追加步骤名称："theme"、"tiles"、"info-icons"、"layout"、"small-stage"、"context-menu-selection"、"file-uploader"。

完全迁移后的项目如下所示：

"a1Migration": {
  "skillVersion": "0.1.5",
  "appliedAt": "YYYY-MM-DD",
  "theme": "<spacious|compact|dense>",
  "steps": ["theme", "tiles", "info-icons", "layout", "small-stage", "file-uploader"]
}

其他迁移运行的跟踪

如果 package.json 中已有 a1Migration 键，请将当前会话中已执行的步骤添加到数组中。