跳轉到

如何部署

從專案執行發佈

  • 發佈專案之前先注意調整 webpack-exposes.config.js 的內容，設定讀取外掛欄位設定檔的位置。
webpack-exposes.config.js
const exposes = {
  // 設定要開放外部使用欄位和頁面
  web: {
    "./HelloWorld": "./src/app/web/hello-world/hello-world.module.ts",
    "./AdvancedField": "./src/app/web/advanced-field/advanced-field.module.ts",
  },
  app: {
    "./HelloWorld": "./src/app/mobile/hello-world/hello-world.module.ts",
    "./AdvancedField": "./src/app/mobile/advanced-field/advanced-field.module.ts",
  },
};
  1. 在 visual studio 的外掛欄位專案(Ede.Uofx.Customize.Web)中，從右鍵選單執行發佈的選項，選擇發佈到資料夾在執行下一步。
    Image project-publish
    visual studio發佈
    Image project-publish2
    發佈到資料夾
  2. 設定發佈資料夾的位置後，點選完成，最後在選擇發佈。
    Image project-publish3
    選擇資料夾
  3. 執行發佈。
    Image project-publish4
    外掛欄位發佈1

    Image project-publish5
    外掛欄位發佈2
  4. 發佈成功。
    Image project-publish6
    發佈成功

在 IIS 中建立外掛模組站台

  1. 建立要在 IIS 中放置外掛模組程式站台的目錄(假設命名為 Sample，C:\inetpub\wwwroot\Sample)，將發佈後的 plugin.manifest.json 與 plugin.versions.json 檔案複製在這個路徑下，檔案內容的設定可以參考 配置與設定。

    Image iis-folder
    建立外掛模組站台根目錄

  2. 建立要在 IIS 中與步驟1相同且加上版號的目錄，例如版本 1.0 就是 Sample1_0，目錄名稱後的版號需要和 plugin.versions.json 內容中的 version 設定 1.0 相對應 ，所以如果版號是 2.0，則目錄名稱需命名為 Sample2_0 以此類推，接著將外掛模組發的所有目錄與檔案都複製到這個 Sample1_0 目錄下。

    Image iis-folder2
    建立外掛模組站台對應版本目錄

  3. 將目錄 Sample 和 Sample1_0 轉換成 Web 應用程式目錄，轉換完成後可透過直接瀏覽外掛模組站台的 remoteEntry.js 確認是否有成功執行，例如：http://172.16.3.123/Sample1_0/remoteEntry.js。

    Image iis-folder3
    轉換成 IIS 應用程式

  4. 可以檢查以下幾個位置是否能正常讀取

    • http://host/Sample/plugin.manifest.json
    • http://host/Sample/plugin.versions.json
    • http://host/Sample1_0/remoteEntry.js
    • http://host/Sample1_0/assets/configs/field-design.json
    • http://host/Sample1_0/assets/configs/field-runtime.json