Azure Static Web Apps Middleware
Qwik City Azure Static Web Apps middleware allows you to connect Qwik City to Azure Static Web Apps.
To integrate the
azure-swa adaptor, use the
npm run qwik add azure-swa
The adaptor will add a new
vite.config.ts within the
adaptors/ directory, and a new entry file will be created, such as:
└── adaptors/ └── azure-swa/ └── vite.config.ts └── src/ └── entry.azure-swa.tsx
Additionally, within the
deploy scripts will be updated.
To build the application for production, use the
build command, this command will automatically run
npm run build.server and
npm run build.client:
npm run build
Deploy to Azure
After installing the integration using
npm run qwik add azure-swa the project is ready to be deployed to Azure Static Web Apps.
There are two ways to deploy:
Deploy with Static Web Apps CLI
You can deploy your application from your local environment with:
npx swa deploy
This will start a wizard which will guide you through login and deployment to Azure.
Deploy from GitHub
You can deploy your application via GitHub. Create a Git repository, commit all your code and then publish your branch to GitHub.
Create an Azure Static Webapp via the Azure Portal and choose the GitHub repository in the deployment details. When prompted for the build details choose "Custom" and set the following values:
- App location: "."
- Api location: "./azure-functions"
- Output location: "./dist"
This will setup a GitHub workflow deploying your application automatically. Read the Azure Static Web Apps quickstart for more information.
Notice that you will need an Azure account in order to complete this step!