方AEM括弧延伸

概覽

Brackets ExtensionAEM提供順暢的工作流程來編輯元件AEM和用戶端程式庫，並運用Brackets程式碼編輯器的功能，讓您從程式碼編輯器存取Photoshop檔案和圖層。 擴充功能提供的簡易同步化功能（不需Maven或File Vault）可提高開發人員的效率，並協助知識有限的前AEM端開發人員參與專案。 此擴充功能也支援HTML範本語言(HTL)，這可免除JSP的複雜性，讓元件開發更輕鬆且更安全。

功能

Brackets Extension的主要AEM功能包括：

• 將變更的檔案自動同步至開AEM發執行個體。
• 手動雙向同步檔案和資料夾。
• 項目的完整內容包同步。
• 運算式和data-sly-*區塊陳述式的HTL程式碼完成。

此外，Brackets還為字型端開發人員提供AEM許多實用功能：

• Photoshop檔案支援從PSD檔案擷取資訊，例如圖層、測量、色彩、字型、文字等。
• 從PSD中的程式碼提示，以輕鬆在程式碼中重複使用此擷取的資訊。
• CSS預處理器支援，例如LESS和SCSS。
• 還有數百個額外擴充功能，可涵蓋更多特定需求。

安裝

括弧

Brackets延伸AEM功能支援Brackets 1.0版或更新版本。

從brackets.io下載最新的Brackets版本。

副檔名

要安裝擴展，請按如下步驟進行：

1. 開啟Brackets。 在菜單​檔案​中，選擇​Extension Manager…

2. 在搜索欄中輸AEM入​​​並查找​AEM Brackets Extension。

   

3. 按一下​Install。

4. 安裝完成後，關閉對話框和Extension Manager。

快速入門

Content-Package Project

在安裝擴充功能後，您就可以開始開發元AEM件，方法是使用Brackets從檔案系統開啟內容封裝檔案夾。

項目至少必須包含：

1. a jcr_root資料夾(例如myproject/jcr_root)

2. a filter.xml檔案(例如myproject/META-INF/vault/filter.xml;有關filter.xml檔案結構的詳細資訊，請參閱工作區篩選定義。

在Brackets的​File​菜單中，選擇​開啟資料夾……​並選擇jcr_root資料夾或父項目資料夾。

專案設定

為了同步您的內容與開發例項之AEM間，您必須定義您的「專案設定」。 您可前往​AEM​功能表並選擇​專案設定……​來完成此作業

「專案設定」可以定義：

1. 伺服器URL(例如http://localhost:4502)
2. 是否允許沒有有效HTTPS憑證的伺服器（請取消勾選，除非需要）
3. 用於同步內容的使用者名稱(例如admin)
4. 使用者的密碼(例如admin)

同步內容

Brackets AEM Extension為filter.xml中定義的篩選規則允許的檔案和檔案夾提供下列類型的內容同步：

自動同步更改的檔案

這只會同步從Brackets到例項的變AEM更，但絕不會相反。

手動雙向同步

在「項目瀏覽器」中，通過按一下右鍵任何檔案或資料夾來開啟上下文菜單，可訪問​導出到伺服器​或​從伺服器​導入選項。

完整內容包同步

在​AEM​功能表中，匯出內容封裝​或​匯入內容封裝​選項可讓整個專案與伺服器同步。

同步狀態

Brackets ExtensionAEM在Brackets視窗右側的工具列中加上通知圖示，指出上次同步的狀態：

• 綠色——所有檔案都已成功同步
• 藍色——正在進行同步操作
• 黃色——部分檔案未同步
• 紅色——未同步任何檔案

按一下通知表徵圖將開啟「同步狀態」報告對話框，其中列出了每個同步檔案的所有狀態。

編輯HTL代碼

BracketsAEM擴充功能也包含一些自動完成功能，以簡化HTL屬性和運算式的編寫。

屬性自動完成

1. 在HTML屬性中，鍵入sly。 屬性自動完成至data-sly-。
2. 在下拉式清單中選取HTL屬性。

運算式自動完成

在運算式${}中，通用變數名稱會自動完成。

更多資訊

Brackets ExtensionAEM是開放原始碼專案，由Adobe Marketing Cloud組織在GitHub上代管，位於Apache授權2.0版：

• 代碼儲存庫：https://github.com/Adobe-Marketing-Cloud/aem-sightly-brackets-extension
• Apache License, 2.0版：https://www.apache.org/licenses/LICENSE-2.0.html

Brackets程式碼編輯器也是開放原始碼專案，由Adobe Systems Incorporated組織代管在GitHub上：

• 代碼儲存庫：https://github.com/adobe/brackets

盡情揮灑創意！