準備部署 Oracle JET 虛擬 DOM 應用程式

簡介

本教學課程示範如何準備 Oracle JavaScript Extension Toolkit (Oracle JET) 虛擬 DOM 應用程式進行部署。

您可以將 Oracle JET 虛擬 DOM 應用程式 (其中包含 HTML 集合、使用 JSX 語法 (TSX) 的 TypeScript 檔案,以及階層式樣式表 (CSS) 檔案集合至任何類型的 Web 或應用程式伺服器。部署方法取決於您 App 所執行的伺服器環境類型。

若要部署 Oracle JET 虛擬 DOM 應用程式,您可以使用與部署特定環境中任何其他從屬端介面相同的方法。

您使用 Oracle JET 命令行介面套裝程式 (npx @oracle/ojet-cli create JET-Virtual-DOM-app --template=basic --vdom) 的命令所建立的虛擬 DOM App 包含一個連接命令檔樣板檔案的目錄,可用來定義組建處理作業的新步驟。例如,您可以建立一個鉤點程序檔,將虛擬 DOM 應用程式 /web 目錄歸檔為 ZIP 檔案或 WAR 檔案。此 after_build 指令碼會在建立程序完成後執行。

本教學課程未說明依賴特定環境和平台的部署步驟。

目標

在本教學課程中,您將瞭解如何將虛擬 DOM 應用程式的 /web 目錄存檔為 ZIP 檔案或 WAR 檔案。您也將瞭解如何修改虛擬 DOM App,在 Oracle JET App 建置流程中將封存自動化。

必要條件

工作 1:建立 after_build Hook 命令檔

您可以使用修改的已提供鉤點指令碼範本檔案來建立 after_build 鉤點指令碼。

  1. 瀏覽至 JET-Virtual-DOM-app/scripts/hooks 目錄,然後在編輯器中開啟 after_build.js 掛載命令檔樣板檔案。

  2. 複製 after-build-js.txt 程式碼片段,並以複製的程式碼片段取代樣板檔案的內容。

工作 2:修改 after_build Hook 命令檔

修改 hook 命令檔,指定要為虛擬 DOM 應用程式產生的存檔檔案類型。鉤點指令集使用相同的壓縮方法來建立 ZIP 檔案和 WAR 檔案。修改 after_build 鉤點指令碼以指定輸出檔案的副檔名,依預設為 .war

  1. after_build.js 檔案中,編輯傳送至 fs.createWriteStream() 的檔案名稱,以使用適當的副檔名:.zip.war
    • 若要產生 WAR 檔案,請將檔案命名為 my-archive.war

      const output = fs.createWriteStream('my-archive.war');
      
    • 若要產生 ZIP 檔案,請將檔案命名為 my-archive.zip

      const output = fs.createWriteStream('my-archive.zip');
      
  2. 儲存 after_build.js 檔案,但不變更檔案名稱。/scripts/hooks 目錄中 hook 命令檔的檔案名稱對應至各種 Oracle JET 組建掛載點。

作業 3:以版次模式建置應用程式

以發行模式建置虛擬 DOM 應用程式時,build --release 指令會以最小化版本取代 /web/ 目錄中的程式庫與命令檔開發版本。組建處理作業完成後,組建接著會執行 after_build hook 命令檔並將 /web 目錄的內容存檔。

  1. 開啟終端機視窗,變更至 JET-Virtual-DOM-app 目錄,然後安裝 archiver npm 套裝軟體。

    npm install archiver
    

    這會在 JET-Virtual-DOM-app 專案中安裝 archiver npm 套裝程式。after_build.js 掛載會使用此套裝程式來封存您的虛擬 DOM 應用程式。

  2. 開啟終端機視窗,變更至 JET-Virtual-DOM-app 目錄,然後在發行版本模式下建置虛擬 DOM 應用程式。

    npx @oracle/ojet-cli build web --release
    

    建置處理作業會觸發位於 /scripts/hooks 目錄中的鉤點命令檔,而且需要幾分鐘的時間才能完成。

  3. 等待確認。

    . . .
    Running after_build hook.
    Success: Build finished.
    Files were successfully archived.
    
  4. 瀏覽至 JET-Virtual-DOM-app 目錄,並找出由 hook 程序檔產生的歸檔檔案。例如,如果您修改 after_build 鉤點指令碼來產生名稱為 my-archive.war 的 WAR 檔案,則具有該名稱的 WAR 檔案會出現在應用程式根目錄中。

    Oracle JET 虛擬 DOM 應用程式根目錄中的 WAR 檔案

    root-folder-with-war-archive.png 圖解描述

下一步

若要繼續前往本系列中下一個學習路徑的第一個教學課程,請按一下此處

其他學習資源

探索 docs.oracle.com/learn 上的其他實驗室,或存取 Oracle Learning YouTube 頻道上的更多免費學習內容。此外,瀏覽 education.oracle.com/learning-explorer 成為 Oracle Learning Explorer。

如需產品文件,請造訪 Oracle Help Center