Problem


I have an open-source project that uses Kendo UI for Angular. I have my own license to use legally, and I wish end users to bring their own licenses. So, I could not include the license file in my public repository. This typically is not a problem because CI/CD can read license values from repository secret. Kendo UI document also have example of setting up license in GitHub Actions.

However, I am using Azure Static Web Apps. There is no example of how to activate Kendo license during SWA build process. I worked 996 for 1 hour and finally figured out how to activate Kendo UI license during the build process of Azure Static Web Apps without including the license itself in repository. Let's see how to do it.

Solution


Create Repository Secret

In your GitHub repository. Go to Settings, Secrets, Actions, and set the name of the secret to KENDO_UI_LICENSE and paste the contents of the license file as a value.

Modify SWA YAML file

Open your SWA YAML file, it is located at .\.github\workflows with different names. For me, it's "azure-static-web-apps-nice-ocean-0afdf4600.yml"

Find "Build And Deploy" step, it is typically using "Azure/static-web-apps-deploy@v1".

Our goal is to run "npx kendo-ui-license activate" before "ng build" or "npm run build". Azure document has a description for how to use custom build commands, but it's example only runs one command, it didn't tell you how to run multiple commands. To run commands in sequence, use &&.

So, we will add a new parameter under "with: " statement.

app_build_command: "npx kendo-ui-license activate && npm run build"

Add environment variable for referencing Kendo UI license we setup in the first step.

env:
  KENDO_UI_LICENSE: ${{ secrets.KENDO_UI_LICENSE }}

The whole section now looks like this

- name: Build And Deploy
  id: builddeploy
  uses: Azure/static-web-apps-deploy@v1
  with:
    azure_static_web_apps_api_token: ${{ secrets.AZURE_STATIC_WEB_APPS_API_TOKEN_NICE_OCEAN_0AFDF4600 }}
    repo_token: ${{ secrets.GITHUB_TOKEN }}
    action: "upload"
    app_location: "/src/Admin/elf-admin" 
    api_location: ""
    output_location: "dist/elf-admin"
    app_build_command: "npx kendo-ui-license activate && npm run build"
  env:
    KENDO_UI_LICENSE: ${{ secrets.KENDO_UI_LICENSE }}

Run build

Now, run your build again, Kendo UI license will be successfully activated.