swa

リファレンス

コマンド

名前	説明	型	状態
swa login	Azure にログインする	SWA Core	GA
swa build	アプリケーションをビルドします。 Node.js アプリケーションがある場合は、最初に依存関係がインストールされます。	SWA Core	GA
swa start	ディレクトリから Azure Static Web Apps エミュレーターを開始するか、実行中の開発サーバーにバインドします。	SWA Core	GA
swa deploy	現在のプロジェクトを Azure Static Web Apps にデプロイします。	SWA Core	GA
swa db	Static Web Apps データベースの接続構成を生成して編集します。	SWA Core	GA

Azure にログインする

swa deploy コマンドを使って Azure Static Web Apps のデプロイトークンを取得するため、Azure で認証を行います。

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 サブスクリプション ID。既定値は、process.env.AZURE_SUBSCRIPTION_ID です。

--resource-group, -R

リソースグループの名前。 az configure --defaults group=<name> を使用して、既定のグループを構成できます。

--tenant-id, -T

Azure テナント ID。既定値は、process.env.AZURE_TENANT_ID です。

--client-id, -C

Azure クライアント ID。

--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、info、log (既定)、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 を複数回実行して、プロジェクトに異なる構成を作成できます。単一リポジトリで作業していて、別のプロジェクトを構成したい場合、これが必要になることがあります。生成された構成ファイルは、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

すべてのプロンプトに対して "yes" と答えます。これにより対話モードが無効になります。既定値は false です。

グローバルパラメーター

--version, -v

バージョン番号を表示します。

--verbose, --V [level]

詳細出力を有効にします。レベルの値には、silly、info、log (既定)、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 を使うには、次の 2 つのステップのようにします。

ローカル開発サーバーを通常どおり起動します。たとえば、Angular を使っている場合: ng serve (または npm start)。
別のターミナルで、開発サーバーから提供された URI を指定して、次の形式で swa start を実行します。

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

次に示すのは、いくつかの一般的な開発サーバーで使われる既定のポートとコマンドの一覧です。

ツール	Port	コマンド
Angular	`4200`	`swa start http://localhost:4200`
Blazor WebAssembly	`5000`	`swa start http://localhost:5000`
Gatsby	`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 を使うには、次の 2 つのステップのようにします。

Azure Functions Core Tools を使って API を開始する (func host start) か、VS Code でデバッグを始めます。
別のターミナルで、--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、info、log (既定)、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、info、log (既定)、silent が含まれます。

--config, -c [path]

swa-cli.config.json ファイルへのパス。

--config-name, -cn

CLI で使われる構成。

--print-config, -g

解決されたすべてのオプションを出力します。既定値は false です。

--help, -h

状況依存のヘルプを表示します。

swa deploy

現在のプロジェクトを Azure Static Web Apps にデプロイします。

一般的な使用用途は次のとおりです。

API なしでフロントエンドアプリをデプロイする
API ありでフロントエンドアプリをデプロイする
Blazor アプリをデプロイする

デプロイトークン

SWA CLI では、デプロイトークンを使ったデプロイがサポートされています。これは多くの場合、CI/CD 環境からデプロイする場合に便利です。次のいずれかからデプロイトークンを取得できます。

Azure portal: [ホーム] → [静的 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 にデプロイできます。

フロントエンドアプリケーションでビルドステップが必要な場合は、swa build を実行するか、お使いのアプリケーションのビルド手順をご覧ください。

オプション 1: デプロイするビルドフォルダーから、deploy コマンドを実行します。

cd build/
swa deploy

注: build フォルダーには、デプロイするアプリの静的コンテンツが含まれている必要があります。 オプション 2: 特定のフォルダーをデプロイすることもできます。

フロントエンドアプリケーションでビルドステップが必要な場合は、swa build を実行するか、お使いのアプリケーションのビルド手順をご覧ください。
アプリをデプロイします。

swa deploy ./my-dist

API ありでフロントエンドアプリをデプロイする

フロントエンドアプリと API の両方を Azure Static Web Apps にデプロイするには、次の手順を使います。

フロントエンドアプリケーションでビルドステップが必要な場合は、swa build を実行するか、お使いのアプリケーションのビルド手順をご覧ください。
staticwebapp.config.json ファイルの API 言語ランタイムのバージョンが正しく設定されていることを確認します。次に例を示します。

{
  "platform": {
    "apiRuntime": "node:16"
  }
}

注: プロジェクトに staticwebapp.config.json ファイルがない場合は、outputLocation フォルダーの下に追加します。

アプリをデプロイします。

swa deploy ./my-dist --api-location ./api

Blazor アプリをデプロイする

Blazor アプリとオプションの API を Azure Static Web Apps にデプロイするには、次の手順を使います。

Blazor アプリをリリース モードでビルドします。

dotnet publish -c Release -o bin/publish

プロジェクトのルートから、deploy コマンドを実行します。

swa deploy ./bin/publish/wwwroot --api-location ./Api

`swa-cli.config.json` を使用してデプロイする

注: outputLocation のパスは、appLocation を基準にして指定する必要があります。プロジェクトで swa-cli.config.json 構成ファイルを使っていて、構成エントリが 1 つある場合は、次のような構成を使います。

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

それから、次の手順を実行して、アプリケーションをデプロイできます。

フロントエンドアプリケーションでビルドステップが必要な場合は、swa build を実行するか、お使いのアプリケーションのビルド手順をご覧ください。
アプリをデプロイします。

swa deploy

複数の構成エントリがある場合は、エントリ ID を指定して、使うものを指定できます。

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、info、log (既定)、silent が含まれます。

--config, -c [path]

swa-cli.config.json ファイルへのパス。

--config-name, -cn

CLI で使われる構成。

--print-config, -g

解決されたすべてのオプションを出力します。既定値は false です。

--help, -h

状況依存のヘルプを表示します。

swa db

Static Web Apps データベースの接続構成を生成して編集します。

swa db init を使って、サンプルの swa-db-connections フォルダーと、staticwebapp.database.config.json 構成ファイルを生成します。 Cosmos DB for NoSQL データベースを使っている場合は、これによりサンプルの 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、info、log (既定)、silent が含まれます。

--config, -c [path]

swa-cli.config.json ファイルへのパス。

--config-name, -cn

CLI で使われる構成。

--print-config, -g

解決されたすべてのオプションを出力します。既定値は false です。

--help, -h

状況依存のヘルプを表示します。

次の方法で共有

swa

コマンド

swa init

例

省略可能のパラメーター

swa start

フォルダーから提供する

開発サーバーから提供する

フロントエンドアプリと API の両方を提供する

API サーバーを自動的に起動する

API サーバーを手動で起動する

データベース接続

例

省略可能のパラメーター

swa build

例

省略可能のパラメーター

swa deploy

デプロイトークン

API なしでフロントエンドアプリをデプロイする

API ありでフロントエンドアプリをデプロイする

Blazor アプリをデプロイする

`swa-cli.config.json` を使用してデプロイする

例

swa db

例

省略可能のパラメーター

フィードバック

その他のリソース

次の方法で共有

swa

コマンド

swa login

例

省略可能のパラメーター

swa init

例

省略可能のパラメーター

swa start

フォルダーから提供する

開発サーバーから提供する

フロントエンド アプリと API の両方を提供する

API サーバーを自動的に起動する

API サーバーを手動で起動する

データベース接続

例

省略可能のパラメーター

swa build

例

省略可能のパラメーター

swa deploy

デプロイ トークン

API なしでフロントエンド アプリをデプロイする

API ありでフロントエンド アプリをデプロイする

Blazor アプリをデプロイする

swa-cli.config.json を使用してデプロイする

例

swa db

例

省略可能のパラメーター

フィードバック

その他のリソース

フロントエンドアプリと API の両方を提供する

デプロイトークン

API なしでフロントエンドアプリをデプロイする

API ありでフロントエンドアプリをデプロイする

`swa-cli.config.json` を使用してデプロイする