体验现代化控制台 console-reference

Experience Modernization Console界面和功能的参考指南

NOTE
如果您有兴趣使用Experience Modernization Console,可以请求访问权限以确保顺利入门体验。

概述 overview

Experience Modernization Console是Edge Delivery Services的托管、AI辅助的开发环境,在aemcoder.adobe.io公开为Web界面。连接到他们的GitHub项目后,您可以立即开始以自然语言提示更改,而无需进一步设置或本地环境配置。

TIP
如果您有兴趣立即开始使用控制台,请查看文档Experience现代化代理快速入门。

功能 capabilities

控制台的核心功能:

  • 与代理的交互式聊天面板及其技能
  • 实时AEM预览,可即时提供更改的可视反馈
  • 内容文件浏览器和Markdown查看器
  • 文档创作的内容同步
  • 用于审阅所做更改的代码浏览器和比较查看器
  • GitHub集成,能够根据更改创建拉取请求

开发人员可以完全控制哪些产品要发货。 通过控制台进行的所有更改都需要在部署之前进行审查和批准,以确保治理、品牌一致性和安全性。

导航 navigation

aemcoder.adobe.io登录到控制台后,您将进入控制台的主屏幕。

控制台的主屏幕

菜单栏 menu-bar

顶部菜单栏提供:

  • 左侧有一个​ 打开菜单 ​按钮,用于展开和折叠左侧面板的详细信息
  • 右侧的​ 帐户 ​按钮,用于切换到深色模式并注销控制台

左侧栏 sidebar

左侧边栏允许快速访问控制台的重要视图。

  • 主页视图(住宅图标) — 您使用该控制台的起点
  • 内容视图(文件图标) — 您已导入的内容
  • 代码视图</>图标) — 您正在处理的网站的代码
  • 设置视图(齿轮图标) — 控制台的设置

主视图 home-view

Home​视图是您使用该控制台的起点。

  • 顶部是一个提示输入,用于发出控制台请求。
  • 提示面板下面是项目入门的建议提示。

提示输入 prompt-input

提示输入提供了用于与AI交互的控件。

  • 计划/执行模式(灯泡和魔棒图标):分别在计划模式和执行模式之间切换

    • 规划模式:人工智能分析请求并概述不做更改的方法,这有助于在提交之前了解策略。
    • 执行模式: AI执行计划并进行实际文件更改。
  • 附加文件(回形针图标):将文件上载并附加到提示以查找其他上下文(例如,参考设计、屏幕快照、规范)

内容视图 content-view

内容视图​提供了浏览和预览内容的工具。 默认情况下,视图将拆分为三个面板,从左至右:

  • 用于与控制台和项目交互的提示面板
  • 用于查看内容文件概览的文件浏览器(切换是否显示带有V形图标的此面板)
  • 用于可视化在文件浏览器中选择的内容的“预览”面板

内容视图

聊天面板 chat-panel

聊天面板允许您查看和继续与Experience现代化代理的对话。 聊天面板包括聊天消息历史记录和用于向控制台发出其他请求的提示输入

  • 聊天操作

    • 清除聊天:这将重置对话并清除AI的上下文窗口。 在启动与上一个对话无关的新任务时,使用此选项。
    • 下载聊天:此操作将对话历史记录下载为Markdown文件。

“预览”面板 preview-panel

“预览”面板提供最多四种模式:

  • 预览(带放大镜图标的文档)以查看渲染的HTML内容

    • 响应视图,用于在桌面、平板电脑或移动设备视图中查看渲染的HTML内容
    • 设计模式 (画笔图标)以将页面的元素添加到提示以添加其他上下文
  • 文档视图(文档图标)分别用于查看基础文档创作内容结构

  • Markdown视图(AEM创作)(代码图标)以查看基础Markdown内容结构

  • JCR XML视图(AEM创作)(数据图标)以查看生成的JCR XML内容结构

您始终可以单击​ 刷新预览 ​图标来更新预览面板。

使用​ 删除 ​按钮可从工作区中删除所选页面。 不会删除预览或发布的内容。

错误”按钮(AEM创作)会打开一个模式窗口,以查看选定页面上的错误。

使用​ Upload content ​按钮可打开一个模式窗口,以将文件上传到AEM。

  • 如果您的项目具有​ 文件,则将预填充 ​组织​ ​存储库fstab.yaml字段
  • 文件选择提供了可编辑的目标路径
  • 不支持上载到JCR(对于通用编辑器)

上传内容

代码视图 code-view

代码视图​提供了用于浏览代码和管理代码更改的工具。 视图由左至右分为三个面板:

  • 用于与控制台和项目交互的聊天面板
  • 文件浏览器,用于获取代码文件的概述或差异更改
  • 预览面板,用于查看在文件浏览器中选择的代码文件或更改

代码视图

“预览”面板提供两种不同的模式:

  • Workspace文件​以浏览当前工作区中的代码文件

    • 使用​ 添加到聊天 ​按钮将文件添加到上下文的聊天面板。
  • Git更改​以查看您项目工作所创建的文件更改的差异

    • 单击+图标存放更改的文件
    • 单击箭头图标可放弃更改的文件

信息​图标列出了您当前连接的GitHub帐户和项目。

GitHub操作​菜单(右上方)提供存储库操作。

  • 连接/重新连接:启动GitHub OAuth
  • 切换存储库:将工作区替换为其他存储库。 任何未提交的工作都将丢失。
  • 切换分支:在同一存储库中切换分支
  • 同步:从远程源提取最新更改
  • 推送:打开一个模式以将工作区更改推送到GitHub
  • 注销:断开与GitHub的连接

推送更改时,您必须先将更改暂存,才能将其包含在推送中。 推送时,您可以选择创建新PR或直接推送至当前分支

推送更改

设置视图 settings-view

设置视图允许您管理控制台的基本设置。

设置视图

  • 项目​允许您查看和编辑项目设置,如自定义库URL。

  • 支持​允许您向AEM支持团队请求帮助。

  • 凭据​允许您为Figma指定个人访问令牌,以便控制台可以访问项目的设计块。

  • 重置工作区​将控制台还原为开始状态,所有未推送或未上传的更改都将丢失。

recommendation-more-help
fbcff2a9-b6fe-4574-b04a-21e75df764ab