AEM Brackets扩展提供了编辑AEM组件和客户端库的流畅工作流程,并利用了Brackets代码编辑器的强大功能,该编辑器允许从代码编辑器中访问Photoshop文件和图层。 扩展提供的轻松同步(无需Maven或File Vault)提高了开发人员的效率,还有助于具有有限AEM知识的前端开发人员参与项目。 此扩展还提供对HTML模板语言(HTL)的一些支持,这消除了JSP的复杂性,使组件开发更简单、安全。
AEM Brackets扩展的主要功能有:
data-sly-*
块语句的HTL代码完成。此外,Brackets还为AEM字体端开发人员提供了许多有用的功能:
AEM Brackets扩展支持Brackets 1.0或更高版本。
从brackets.io下载最新的Brackets版本。
要安装扩展,请按如下步骤继续:
打开Bracket。 在菜单文件中,选择Extension Manager…
在搜索栏中输入AEM并查找AEM Brackets Extension。
单击安装。
安装完成后关闭对话框和Extension Manager。
安装扩展后,您可以通过使用Brackets从文件系统打开一个内容包文件夹来开始AEM组件的开发。
项目必须至少包含:
jcr_root
文件夹(例如myproject/jcr_root
filter.xml
文件(例如myproject/META-INF/vault/filter.xml
);有关filter.xml
文件结构的详细信息,请参阅工作区过滤器定义。
在Brackets的File菜单中,选择打开文件夹……并选择jcr_root
文件夹或父项目文件夹。
如果您没有包含内容包的项目,则可以尝试HTL TodoMVC Example。 在GitHub上,单击下载ZIP,在本地解压文件,然后按照上面的说明,在Brackets中打开jcr_root
文件夹。 然后,按照以下步骤设置项目设置,最后按照完整内容包同步部分的进一步说明,通过执行导出内容包操作,将整个包上传到您的AEM开发实例。
完成这些步骤后,您应可以访问AEM开发实例上的/content/todo.html
URL,并可以开始对Brackets中的代码进行修改,并查看在Web浏览器中进行刷新后如何立即将更改同步到AEM服务器。
要与AEM开发实例同步内容,您需要定义项目设置。 要执行此操作,请转到AEM菜单并选择“项目设置……
项目设置允许定义:
http://localhost:4502
)admin
)admin
)AEM Brackets扩展为filter.xml
中定义的过滤规则允许的文件和文件夹提供以下类型的内容同步:
这将仅同步从Brackets到AEM实例的更改,但不会相反。
在项目资源管理器中,通过右键单击任何文件或文件夹打开上下文菜单,可以访问导出到Server或从Server导入选项。
如果所选条目位于jcr_root
文件夹之外,则禁用导出到Server和从Server导入上下文菜单条目。
在AEM菜单中,导出内容包或导入内容包选项允许将整个项目与服务器同步。
AEM Brackets扩展功能在Brackets窗口右侧的工具栏中显示一个通知图标,它指示上次同步的状态:
单击通知图标将打开“同步状态”报告对话框,其中列表了每个已同步文件的所有状态。
将只同步标记为filter.xml
的筛选规则所包含的内容,而不管使用的同步方法。
此外,支持.vltignore
文件,以排除与存储库同步或从存储库同步的内容。
AEM Brackets扩展还具有一些自动完成功能,可轻松编写HTL属性和表达式。
sly
。 属性自动完成为data-sly-
。在表达式${}
中,常用变量名称会自动完成。
AEM Brackets Extension是一个开放源项目,由Adobe Marketing Cloud组织在GitHub上托管,位于Apache许可证版本2.0下:
Brackets代码编辑器也是一个开放源码项目,由Adobe Systems Incorporated组织在GitHub上托管:
请随时投稿!