透過前端管道, 前端開發人員可獲得更多獨立性,且開發流程可獲得大幅度的速度。 本檔案說明此程式的運作方式,以及一些需要注意的事項,以便充分發揮此程式的潛力。
如果您還不熟悉如何使用前端管道及其帶來的好處,請檢視 快速網站建立歷程 有關如何快速部署新網站並完全獨立於後端開發來自訂其主題的範例。
類似於 完整棧疊組建環境, 前端管道有其自己的環境。 只要遵循以下前端建置合約,開發人員就可以在此管道中擁有一些彈性。
前端管道需要前端Node.js專案使用 build
指令碼指示詞,用於產生將由前端管道部署的建置。 即Cloud Manager使用命令 npm run build
將可部署的專案產生至 dist
資料夾。
的內容 dist
資料夾是最終部署到AEM的內容,與Cloud Manager管道as a Cloud Service。
預設情況下,前端管道使用節點14,但也可以使用12和16。
您可以使用 CM_CUSTOM_VAR_NODE_VERSION
環境變數來設定所需的版本。
一般良好做法是維護部署至AEM的單一信任來源。 Cloud Manager的目標是讓該單一真實來源變得顯而易見。 但是,由於前端管道允許分離部分代碼的位置,因此前端管道的正確設定有一些額外的責任。 必須注意不要建立多個前端管道來部署到相同環境中的相同站點。
因此,特別是當建立了幾個前端管道時,建議保持如以下的系統化命名慣例:
name
的屬性 package.json
檔案中,應包含套用到的網站名稱。 例如,對於位於 /content/wknd
,前端模組的名稱會類似於 wknd-theme
.wknd-theme
,則封入資料夾名稱類似於 wknd-theme-sources
.wknd-theme
,此管道的名稱可能如下 wknd-theme-prod
.此慣例應有效防止下列部署錯誤:
適用於任何疑慮分離的另一個良好做法,是特別注意分離疑慮的合約如何設計和管理。 在前端管道中,將該程式碼與其餘程式碼分開的合約是網站呈現的HTML和JSON。 如果該HTML和JSON保持穩定,則前端管道會讓前端團隊完全獨立,以實現其最大價值。
目前沒有與前端管道同步執行完整棧疊管道的特定功能。 因此,當將前端開發從完整棧疊管道分離時,必須在分離這兩個關注領域的合約中格外小心。 該合約通常是Experience Manager轉譯的HTML和/或JSON。 因此,該合約的變更必須在操作不同管道的團隊之間精心規劃,以便他們同意如何排列對應變更的順序。
當需要對HTML和/或JSON輸出執行會影響這兩個關注領域的變更時,通常建議採取以下步驟。
dev
分支,如此一來針對開發環境所做的變更,便可輕鬆合併回 main
要部署到生產環境的分支。dev
分支,如上一個點所述。npx aem-site-theme-builder proxy
在前端模組內執行的命令會啟動向AEM環境請求內容的Proxy伺服器,同時將前端模組的CSS和JS檔案替換為來自本機的檔案 dist
資料夾。AEM_URL
變數 .env
檔案可控制本機Proxy伺服器使用內容的AEM環境。AEM_URL
因此,允許在生產環境和開發環境之間切換,以便調整CSS和JS,使其適合這兩個環境。