How to do the SPFx CICD using GitHub Actions?


Use following very simple steps to get any PnP SPFx web part or extensions to your tenant using Github Actions.

I recommend use the following two links to get any sample code.

Prerequisite is that you have already cloned the PnP repo. Or if you like you can download the repo as a Zip file.

c:\PnPSPFX\>git clone

Step by Step Solution

Step #1 Lets assume you want to get the “js-application-alert-message“. Create a Git Hub Repo.

Create a Git repo/

Step #2 Copy entire directory “js-application-alert-message” to a new location say ‘c:\demo\js-application-alert-message’ e.g.

xcopy react-application-festivals*.* c:\demo2\js-application-alert-message*.* /E /F

Step #3 Push the new directory with the code to the NEW GitHub repo using the following commands.

 git init
 git add *.*
 git commit -m "first draft"
 git remote add origin
 git push -u origin master 

Step #4 Your source in the GitHub repo. It is time for creating two new secrets.

adminUsername (I used the admin@[TENANT_NAME]

adminPassword (password for the tenant)

on your repo click on “Settings” then click on the “Secrets”.

Add above two new secrets.

Step #5 It is time to add the GitHub Actions Workflow.

Step #6 Check the build and deploy is complete.

About Pankaj

I am a Developer and my linked profile is
This entry was posted in SharePoint. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s