共用方式為


swa

命令

名稱 Description 類型 狀態
swa login

登入 Azure

SWA 核心 GA
swa build

建置應用程式。 如果您有Node.js應用程式,它會先安裝相依性。

SWA 核心 GA
swa start

從目錄啟動 Azure Static Web Apps 模擬器,或系結至執行中的開發伺服器。

SWA 核心 GA
swa deploy

將目前的專案部署至 Azure Static Web Apps。

SWA 核心 GA
swa db

產生和編輯靜態 Web Apps 資料庫連線設定。

SWA 核心 GA

swa login

登入 Azure

使用 swa deploy 命令向 Azure 進行驗證,以取得 Azure Static Web Apps 的部署令牌。

swa login
          [--subscription-id]
          [--resource-group]
          [--tenant-id]
          [--client-id]
          [--client-secret]
          [--app-name]
          [--clear-credentials]
          [--use-keychain]
          [--no-use-keychain]

範例

互動式登入 Azure

swa login

選擇性參數

--subscription-id, -S

此專案所使用的 Azure 訂用帳戶標識碼。 預設值為 process.env.AZURE_SUBSCRIPTION_ID

--resource-group, -R

資源群組的名稱。 您可以使用 az configure --defaults group=<name> 來設定預設群組。

--tenant-id, -T

Azure 租用戶標識碼。 預設值為 process.env.AZURE_TENANT_ID

--client-id, -C

Azure 用戶端標識碼。

--client-secret, -CS

Azure 客戶端密碼。

--app-name, -n

Azure Static Web Apps 應用程式名稱。

--clear-credentials -cc

在登入之前清除保存的認證。 預設值為 false

--use-keychain, -u

使用操作系統原生金鑰鏈進行持續性認證。 預設值為 true

--no-use-keychain, -nu

停用作業系統原生金鑰鏈的使用。

全域參數
--version, -v

顯示版本號碼。

--verbose, --V [level]

啟用詳細信息輸出。 層級值包括silly、、 log info(預設值)和 silent

--config, -c [path]

swa-cli.config.json檔案的路徑。

--config-name, -cn

CLI 所使用的組態。

--print-config, -g

列印所有已解析的選項。 預設值為 false

--help, -h

顯示內容相關說明。

swa init

設定新的 Azure Static Web Apps 專案。

使用 Static Web Apps CLI 設定新的 Azure Static Web Apps 專案。 互動式模式會提示您輸入組態名稱,將會偵測您的項目設定和所使用的架構。 完成後,就會建立新的靜態 Web 應用程式,並在目前目錄中產生swa-cli.config.json檔案。 您可以多次執行 swa init ,為您的專案建立不同的組態。 如果您正在處理 monorepo,而且想要設定不同的專案,您可以執行此動作。 產生的組態檔會用於您使用 Static Web Apps CLI 執行的每個命令。 如果您有多個具名組態,您可以使用位置自變數或 --config-name 選項來指定要使用的組態。 以下是命令所產生的 init 範例組態:

  "$schema": "https://aka.ms/azure/static-web-apps-cli/schema",
  "configurations": {
    "myApp": {
      "appLocation": ".",
      "apiLocation": "api",
      "outputLocation": "dist",
      "appBuildCommand": "npm run build",
      "apiBuildCommand": "npm run build --if-present",
      "run": "npm run dev",
      "appDevserverUrl": "http://localhost:8080"
    }
  }
} ```
swa init
          [--yes]

範例

以互動方式建立新的組態。

swa init

使用所有選項的預設值建立新的組態。

swa init --yes

使用swa-cli.config.json檔案中名為 「myApp」 的組態,初始化專案。

swa init --config-name myApp

選擇性參數

--yes, -y

回答所有提示的「是」,這會停用互動式模式。 預設值為 false

全域參數
--version, -v

顯示版本號碼。

--verbose, --V [level]

啟用詳細信息輸出。 層級值包括silly、、 log info(預設值)和 silent

--config, -c [path]

swa-cli.config.json檔案的路徑。

--config-name, -cn

CLI 所使用的組態。

--print-config, -g

列印所有已解析的選項。 預設值為 false

--help, -h

顯示內容相關說明。

swa start

從目錄啟動 Azure Static Web Apps 模擬器,或系結至執行中的開發伺服器。

從資料夾提供服務

根據預設,CLI 會啟動並提供目前工作目錄中 ./的任何靜態內容:

swa start

如果靜態應用程式的成品資料夾位於不同的資料夾下(例如 ./my-dist),請執行 CLI 並提供該資料夾:

swa start ./my-dist

從開發伺服器提供服務

在本機開發前端應用程式時,使用前端架構 CLI 隨附的開發伺服器通常很有用。 使用架構 CLI 可讓您使用內建功能,例如 「livereload」 和 HMR (熱模組取代)。 若要搭配本機開發伺服器使用 SWA CLI,請遵循下列兩個步驟:

  1. 像往常一樣啟動您的本機開發伺服器。 例如,如果您使用 Angular: ng serve (或 npm start)。
  2. 在不同的終端機中,使用開發伺服器所提供的 URI 執行 swa start ,格式如下:
swa start http://<APP_DEV_SERVER_HOST>:<APP_DEV_SERVER_PORT>

以下是一些熱門開發伺服器所使用的預設埠和命令清單:

工具 連接埠 Command
Angular 4200 swa start http://localhost:4200
Blazor WebAssembly 5000 swa start http://localhost:5000
蓋茨比 8000 swa start http://localhost:8000
Hugo 1313 swa start http://localhost:1313
Next.js 3000 swa start http://localhost:3000
React (建立 React 應用程式) 3000 swa start http://localhost:3000
Svelte (sirv-cli) 5000 swa start http://localhost:5000
Vue 3000 swa start http://localhost:3000

您可以將啟動命令提供給 CLI,而不是個別啟動開發伺服器。

# npm start script (React)
swa start http://localhost:3000 --run "npm start"

# dotnet watch (Blazor)
swa start http://localhost:5000 --run "dotnet watch run"

# Jekyll
swa start http://localhost:4000 --run "jekyll serve"

# custom script
swa start http://localhost:4200 --run "./startup.sh"

然後使用模擬服務從存取應用程式 http://localhost:4280

同時提供前端應用程式和 API

如果您的專案包含 API 函式,CLI 會檢查是否已安裝並可使用 Azure Functions Core Tools。 如果沒有,CLI 會下載並安裝正確的 Azure Functions Core Tools 版本。

自動啟動 API 伺服器

執行 CLI 並提供包含 API 後端的資料夾(有效的 Azure Functions 應用程式專案):

# static content plus an API
swa start ./my-dist --api-location ./api

# front-end dev server plus an API
swa start http://localhost:3000 --api-location ./api

手動啟動 API 伺服器

在本機開發後端時,有時候個別執行 Azure Functions Core Tools 來提供 API 會很有用。 這可讓您使用內建功能,例如偵錯和豐富的編輯器支援。 若要搭配本機 API 後端開發伺服器使用 CLI,請遵循下列兩個步驟:

  1. 使用 Azure Functions Core Tools 啟動 API: func host start 或在 VS Code 中開始偵錯。
  2. 在不同的終端機中,使用 --api-location 旗標和本機 API 伺服器的 URI 執行 SWA CLI,格式如下:
swa start ./my-dist --api-location http://localhost:7071

資料庫連結 (部分機器翻譯)

若要使用 資料庫連接啟動應用程式,請使用 --data-api-location 參數,並指向包含 staticwebapp.database.config.json 檔案的資料夾。

swa start ./src --data-api-location swa-db-connections

範例

使用預設值啟動應用程式。

swa start

使用前端開發伺服器啟動應用程式。

swa start http://<APP_DEV_SERVER_HOST>:<APP_DEV_SERVER_PORT>

使用前端和後端開發伺服器啟動應用程式。

swa start http://<APP_DEV_SERVER_HOST>:<APP_DEV_SERVER_PORT> --api-location http://localhost:7071

選擇性參數

--app-location, -a <PATH>

包含前端應用程式原始碼的資料夾。 預設值為 .

--api-location, -i <PATH>

包含 API 應用程式原始碼的資料夾。

--output-location, -O <PATH>

包含前端應用程式建置來源的資料夾。 路徑相對於 --app-location。 預設值為 .

--data-api-location

包含 staticwebapp.database.config.json 檔案的資料夾。

--app-devserver-url, -D <URL>

在此 URL 連線到應用程式開發伺服器,而不是使用輸出位置。

--api-devserver-url, -is <URL>

連線到此 URL 上的 API 伺服器,而不是使用輸出位置。

--api-port, -j <API_PORT>

傳遞至 func start的 API 伺服器埠。 預設值為 7071。

--host, -q <HOST>

用於 CLI 開發伺服器的主機位址。 預設值為 localhost

--port, -p <PORT>

要用於 CLI 開發伺服器的埠值。 預設 4280

--ssl, -s

透過 HTTPS 提供前端應用程式和 API。 預設值為 false

--ssl-cert, -e <SSL_CERT_LOCATION>

啟用 HTTPS 時所使用的 SSL 憑證 (.crt)。

--ssl-key, -k <SSL_KEY_LOCATION>

啟用 HTTPS 時所使用的 SSL 金鑰 (.key]。

--run, -r <STARTUP_SCRIPT>

在啟動時執行的自定義殼層命令或腳本檔案的位置。

--devserver-timeout, -t <TIME>

連線到前端應用程式的開發伺服器或 API 伺服器時,等候的時間量(以秒為單位)。 預設值為 60。

--swa-config-location, -w <SWA_CONFIG_FILE_LOCATION>

檔案的 staticwebapp.config.json 目錄位置。

--open, -o

開啟瀏覽器至開發伺服器。 預設為 False。

--func-args, -f <FUNCTION_ARGUMENTS>

將其他自變數傳遞至 func start 命令。

全域參數
--version, -v

顯示版本號碼。

--verbose, --V [level]

啟用詳細信息輸出。 層級值包括silly、、 log info(預設值)和 silent

--config, -c [path]

swa-cli.config.json檔案的路徑。

--config-name, -cn

CLI 所使用的組態。

--print-config, -g

列印所有已解析的選項。 預設值為 false

--help, -h

顯示內容相關說明。

swa build

建置應用程式。 如果您有Node.js應用程式,它會先安裝相依性。

常見的使用案例包括:安裝前端應用程式和 API 的相依性,以及針對兩者執行建置命令,只有在另一個沒有建置步驟時,才建置前端或 API 專案。

swa build
          [--app-location]
          [--api-location]
          [--output-location]
          [--app-build-command]
          [--api-build-command]
          [--auto]

範例

建置應用程式,並選擇性地安裝相依性。

swa build

偵測如何在安裝相依性之後建置應用程式並執行建置命令。

swa build --auto

安裝前端應用程式的相依性。

swa build --app-location ./client

使用 *swa-cli.config.json* 中名為 'myApp' 的組態來建置您的前端應用程式。

swa build myApp

選擇性參數

--app-location, -a

包含前端應用程式原始碼的資料夾。 預設值為 .

--api-location, -i

包含 API 應用程式原始碼的資料夾。

--output-location, -O

包含前端應用程式建置來源的資料夾。 這個路徑相對於 --app-location。 預設值為 .

--app-build-command, -A

建置前端應用程式。

--api-build-command, -I

建置 API 應用程式。

--auto

自動偵測如何建置前端和 API 應用程式。 預設值為 false

全域參數
--version, -v

顯示版本號碼。

--verbose, --V [level]

啟用詳細信息輸出。 層級值包括silly、、 log info(預設值)和 silent

--config, -c [path]

swa-cli.config.json檔案的路徑。

--config-name, -cn

CLI 所使用的組態。

--print-config, -g

列印所有已解析的選項。 預設值為 false

--help, -h

顯示內容相關說明。

swa deploy

將目前的專案部署至 Azure Static Web Apps。

常見使用案例包括:

  1. 部署沒有 API 的前端應用程式
  2. 使用 API 部署前端應用程式
  3. 部署 Blazor 應用程式

部署令牌

SWA CLI 支援使用部署令牌進行部署。 從 CI/CD 環境部署時,這通常很有用。 您可以從下列其中一項取得部署權杖:

  • Azure 入口網站:首頁→靜態 Web 應用程式→實例 →概觀→管理部署令牌

  • 如果您使用 Azure CLI,您可以使用下列命令取得專案的部署權杖:

    az staticwebapp secrets list --name <APPLICATION_NAME> --query "properties.apiKey"
    
  • 如果您使用 Azure Static Web Apps CLI,您可以使用下列命令:

    swa deploy --print-token
    

    然後,您可以將該值與 --deployment-token <TOKEN> 搭配使用,也可以建立名為 SWA_CLI_DEPLOYMENT_TOKEN 的環境變數,並將其設定為部署令牌。

    重要:請勿將部署令牌儲存在公用存放庫中。 此值必須保持秘密。

部署沒有 API 的前端應用程式

您可以執行下列步驟,將沒有 API 的前端應用程式部署到 Azure Static Web Apps:

  1. 如果您的前端應用程式需要建置步驟,請執行 swa build 或參考應用程式建置指示。

    選項 1: 從您想要部署的組建資料夾中,執行 deploy 命令:
cd build/
swa deploy

注意:資料夾 build 必須包含您要部署之應用程式的靜態內容。 選項 2: 您也可以部署特定資料夾:

  1. 如果您的前端應用程式需要建置步驟,請執行 swa build 或參考您的應用程式建置指示。
  2. 部署您的應用程式:
swa deploy ./my-dist

使用 API 部署前端應用程式

若要將前端應用程式和 API 部署至 Azure Static Web Apps,請使用下列步驟:

  1. 如果您的前端應用程式需要建置步驟,請執行 swa build 或參考您的應用程式建置指示。
  2. 請確定檔案中的 staticwebapp.config.json API 語言執行平臺版本已正確設定,例如:
{
  "platform": {
    "apiRuntime": "node:16"
  }
}

注意:如果您的項目沒有任何 staticwebapp.config.json 檔案,請在資料夾 outputLocation 下新增一個檔案。

  1. 部署您的應用程式:
swa deploy ./my-dist --api-location ./api

部署 Blazor 應用程式

若要使用選擇性 API 將 Blazor 應用程式部署至 Azure Static Web Apps,請使用下列步驟:

  1. 發行 模式建置您的 Blazor 應用程式:
dotnet publish -c Release -o bin/publish
  1. 從專案的根目錄中,執行 deploy 命令:
swa deploy ./bin/publish/wwwroot --api-location ./Api

使用部署 swa-cli.config.json

注意:的路徑 outputLocation 必須相對於 appLocation。 如果您在專案中使用 swa-cli.config.json 組態檔並具有單一組態專案,請使用如下的組態:

{
  "configurations": {
    "my-app": {
      "appLocation": "./",
      "apiLocation": "api",
      "outputLocation": "frontend",
      "start": {
        "outputLocation": "frontend"
      },
      "deploy": {
        "outputLocation": "frontend"
      }
    }
  }
}

然後,您可以執行下列步驟來部署應用程式:

  1. 如果您的前端應用程式需要建置步驟,請執行 swa build 或參考應用程式建置指示。
  2. 部署您的應用程式:
swa deploy

如果您有多個組態專案,您可以提供專案識別碼來指定要使用的項目識別碼:

swa deploy my-otherapp
swa deploy
          [--yes]

範例

使用部署令牌進行部署。

swa deploy ./dist/ --api-location ./api/ --deployment-token <TOKEN>

使用環境變數中的部署令牌進行部署

SWA_CLI_DEPLOYMENT_TOKEN=123 swa deploy ./dist/ --api-location ./api/

使用 『swa-cli.config.json』 檔案進行部署

swa deploy swa deploy myconfig

列印部署令牌

swa deploy --print-token

部署到特定環境

swa deploy --env production
全域參數
--version, -v

顯示版本號碼。

--verbose, --V [level]

啟用詳細信息輸出。 層級值包括silly、、 log info(預設值)和 silent

--config, -c [path]

swa-cli.config.json檔案的路徑。

--config-name, -cn

CLI 所使用的組態。

--print-config, -g

列印所有已解析的選項。 預設值為 false

--help, -h

顯示內容相關說明。

swa db

產生和編輯靜態 Web Apps 資料庫連線設定。

使用 swa db init 來產生範例 swa-db-connections 資料夾,以及 staticwebapp.database.config.json 組態檔。 如果您使用適用於 NoSQL 資料庫的 Cosmos DB,這也會產生範例 staticwebapp.database.schema.gql 架構檔案。

swa db init --database-type <DATABASE_TYPE>

範例

產生 Azure SQL 資料庫的範例資料庫聯機組態資料夾。

swa db init --database-type mssql

選擇性參數

--database-type, -t <DATABASE_TYPE>

(必要)您要連線的資料庫類型(mssql、postgresql、cosmosdb_nosql、mysql)。

--folder-name, -f <FOLDER_NAME>

用來覆寫慣例資料庫聯機組態資料夾名稱的資料夾名稱(請確定您據以更新 CI/CD 工作流程檔案)。 預設值是 swa-db-connections

---connection-string, -cs <CONNECTION_STRING>

您要連線之資料庫的 連接字串。

--cosmosdb_nosql-database, -nd <COSMOSDB_NOSQL_DATABASE>

您想要連接的 Cosmos DB 帳戶資料庫(只有在使用 cosmosdb_nosql 資料庫類型時才需要)。

--cosmosdb_nosql-container, -nc <COSMOSDB_NOSQL_CONTAINER>

您想要連線之 cosmosdb 帳戶的容器。

--help, -h

顯示命令的說明。

全域參數
--version, -v

顯示版本號碼。

--verbose, --V [level]

啟用詳細信息輸出。 層級值包括silly、、 log info(預設值)和 silent

--config, -c [path]

swa-cli.config.json檔案的路徑。

--config-name, -cn

CLI 所使用的組態。

--print-config, -g

列印所有已解析的選項。 預設值為 false

--help, -h

顯示內容相關說明。