Close
AlgoliaLogoLight
Close full mode
logo

Deploy Ionic app to Azure App Service

Git RepositoryEdit on Github
Last update: an hour ago by aaronammReading time: 2 min

Minimum requirement

  • You already have source code on GitHub.
  • You have Azure account.

Deploy Ionic 1 to Azure App Service

  • Create Azure App Service with
    • Publish: Code
    • Runtime stack: Node 10 LTS
    • Operation System: Windows
  • In App Service Configuration, set WEBSITE_WEBDEPLOY_USE_SCM = true
  • Download publish profile from App Service Overview page
  • Create a new publish secret in GitHub repository
    • Go to your GitHub repository > Settings page > Secrets > Click New repository secret
    • Name to AZURE_WEBAPP_PUBLISH_PROFILE
    • Value as a content of download publish profile
    • Click Add secret
  • At root of the project, create .github\workflows\deploy-ionic-app-to-azure-app-service.yml
  • Then add the following content:
name: Deploy Ionic 1 app to Azure App Service
# This workflow is triggered when pushing to a main branch
on:
push:
branches:
- main
env:
AZURE_WEBAPP_NAME: my-ionic-app # Set this to your app service name
PACKAGE_PATH: './www' # Set this to the path to your web app project, defaults to the repository root
NODE_VERSION: 10.x # Set this to the node version to use
jobs:
build-and-deploy:
runs-on: windows-2019
# You can use default run to set default shell to all steps
defaults:
run:
shell: powershell
# Using a specific shell https://docs.github.com/en/actions/reference/workflow-syntax-for-github-actions#using-a-specific-shell
steps:
- name: Checkout the latest source code
uses: actions/[email protected] # For more version https://github.com/actions/checkout/releases
- name: Use Node.js version ${{ env.NODE_VERSION }}
uses: actions/setup-[email protected]
with:
node-version: ${{ env.NODE_VERSION }}
# Gulp CLI already installed
# https://github.com/actions/virtual-environments/blob/main/images/win/scripts/Installers/Install-NodeLts.ps1
- name: Install Bower as global tools
run: |
npm install -g bower
- name: Build all Node.js projects with npm
run: |
bower install
npm install
npm run build
- name: Deploy Azure App Service code Node.js and use IIS 10.0, Windows Server 2016
uses: azure/webapps-[email protected]
with:
app-name: ${{ env.AZURE_WEBAPP_NAME }}
# Before downloading load publish profile, make sure that you have set WEBSITE_WEBDEPLOY_USE_SCM
# in App Service Configuration to true
publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE }}
package: ${{ env.PACKAGE_PATH }}
  • When you commit and push code to main branch, it will automatically deploy to Azure App Service
  • You can check deployment status in Actions menu on the main page of your repository

Known issues

Previous
Deploy Gatsby to GitHub Pages
Next
Deploy Oauth2 Proxy to App Service container