Maintain projects with different SharePoint Framework versions using Azure Container Registry

Developer Support

In this post, App Dev Manager Norberto Planchart demonstrates how to create and consume Docker containers for SPFx projects using Azure Container Registry.

SharePoint Framework (SPFx) is growing rapidly, which is good because in each version it gives us more and more features and functionality. But, on the other hand, it creates a problem for us when we must maintain our “old” projects that are already in production. Due to time constraints, we don’t always have the option to migrate to the latest version.

If we must make a minor change, the ideal is to keep the project in its version, but surely our development environment is already in a higher version. In the past, the solution would be to have a virtual machine for each version that we maintain. But now we have containers, here is where Azure Container Register (ACR) will help us.

ACR is a managed Docker registry service based on the open source Docker Registry 2.0. ACR is the ideal choice if we want to have standard images for all of our developers, shared images with our continuous integration (CI) processes, and manage everything from a single platform and provider.

In this article we are going to see how to create and consume images to our SPFx projects.



Developers machine:

Create an Azure Container Register:

  • Login into Azure

az login

  • Create tags and variables

$tags = @{“Departament”=”IT”; ” Environment”=”Dev”}

$ResourceGroup_Name = “rgSharePoint”

$AzureContainerRegistry_Name = “acrSharePoint”

  • Create a resourse group if need

az group create –name $ResourceGroup_Name –location westus –tags $tags

  • Create an Azure Container Register

az acr create -g $ResourceGroup_Name -n $AzureContainerRegistry_Name –sku Basic –admin-enabled

Build images and publish to ACR:

  • Images version 1.10.0 tag as V1.10.0

cd C:\Code\DockerFile\SPFx\V1.10.0

az acr build –image spfx:latest –registry $AzureContainerRegistry_Name –file .\SPFxV1.10.0.Dockerfile .

  • Images version 1.10.0 tag as latest

cd C:\Code\DockerFile\SPFx\V1.10.0

az acr build –image spfx:latest –registry $AzureContainerRegistry_Name –file .\SPFxV1.10.0.Dockerfile .

  • Images version 1.10.0 tag as V1.9.1

cd C:\Code\DockerFile\SPFx\V1.9.1

az acr build –image spfx:1.9.1–registry $AzureContainerRegistry_Name –file .\SPFxV1.9.1.Dockerfile .

Note: You can use the Waldek Mastykarz docker imagen listed in the references.

Here the result in the Azure Portal:

With these commands we get the login server and password to use later:

az acr show –name $AzureContainerRegistry_Name –query loginServer

$password = az acr credential show -n $AzureContainerRegistry_Name –query “passwords[0].value” -o tsv

Testing on a dev machine:

  • Log in to an Azure Container Registry

az acr login –name “acrSharePoint” –password “UMpSoqcR=CzKAVfWX1PWwJs38RjQsjmk” –username “acrSharePoint”

  • Create and start a container

docker run -it –rm –name spfx-helloworld1.10.0 -v C:/Code/Projects/SPFx/V1.10.0:/usr/app/spfx -p 5432:5432 -p 4321:4321 -p 35729:35729

For example, we can create a new project in this version.



Discussion is closed.

Feedback usabilla icon