This template helps you quickly publish a static website to Azure Web App (Static Site).
- Deploy a Vue 3 application using Vite.
- Infrastructure as Code (IaC) with Bicep templates.
- Supports Azure's F1 (free) SKU for cost-effective hosting.
Run the following command to clone the template and set up your environment:
azd init --template erudinsky/azd-static-web-vuejsYou will be prompted to provide:
- Environment Name: A unique prefix for the resource group that will hold all Azure resources.
The azd auth login command is used to authenticate your Azure Developer CLI (azd) with your Azure account. This step ensures that the CLI has the necessary permissions to manage resources in your Azure subscription.
When you run this command, it will:
- Open a browser window prompting you to log in to your Azure account.
- Authenticate your session and link it to the Azure Developer CLI.
Once authenticated, you can seamlessly deploy and manage Azure resources using azd commands.
Use the following command to build your application, provision Azure resources, and deploy the application:
azd upThis command will prompt you for:
- Azure Location: The region where your resources will be deployed.
- Azure Subscription: The subscription where your resources will be created.
Once deployment is complete, you can access your static website using the URL provided in the output.
- This template uses the F1 (free) SKU for Azure App Service, which has limited CPU and RAM resources. For production use, consider upgrading to a paid SKU.
- Refer to the Azure Pricing Calculator for details on available SKUs and their costs.
- This template includes a sample Vue.js application located in
vue-appdirectory. To use this template for your own Vue.js application, ensure that your app is located invue-appor update theprojectattribute in theazure.yamlfile accordingly.