本檔案說明使用原型根據Angular架構建立單頁應用程式(SPA)時所建立專案的詳細資訊。 即當您設定 frontendModule
選項至 angular
.
此專案已使用 ANGULARCLI.
此應用程式建置為使用網站的AEM模型。 它會使用來自的協助程式元件來自動產生版面 @adobe/cq-angular-editable-components 封裝。
在專案目錄中,您可以執行下列指令。
npm start
此命令會從在http://localhost:4502執行的本機AEM執行個體代理JSON模型,以在開發模式中執行應用程式。 這假設整個專案已部署到AEM至少一次(mvn clean install -PautoInstallPackage
(位於專案根目錄中)。
在ui.frontend目錄中執行npm start後,應用程式將自動在瀏覽器中開啟(路徑為http://localhost:4200/content/${appId}/${country}/${language}/home.html)。 如果您進行編輯,頁面將會重新載入。
如果您收到與CORS相關的錯誤,您可以依照以下方式設定AEM:
npm test
這個指令會啟動Karma測試執行器。 請參閱 有關執行測試的Angular檔案 以取得詳細資訊。
npm run test:debug
這個指令會在互動式監看模式中啟動Karma測試執行器。
npm run build
此命令會將生產用途的應用程式建置到建置資料夾。 它在生產模式下整合Angular,並將組建最佳化以獲得最佳效能。 請參閱 有關部署的Angular檔案 以取得詳細資訊。
此外,AEM ClientLib是透過以下方式從應用程式產生的: aem-clientlib-generator 封裝。
請參閱一般 ui.frontend模組檔案 以進一步瞭解專案原型如何使用AEM ClientLibs。
預設情況下,此專案使用 Browserslist的預設值選項來識別目標瀏覽器。 此外,它包含現代語言功能的polyfill,以支援舊版瀏覽器(例如Internet Explorer 11)。 如果不需要支援這類瀏覽器,可以移除polyfill相依性和匯入。