How To Set Up Your SharePoint Framework Development Environment

This is an article about setting up your SharePoint Framework development environment on your machines. Let us see what we have to do.


Follow the steps and just run them as stated.

1. Install NodeJS Click on this link NodeJS LTS version and install the NodeJS solution on your machine.


2. Install Code Editor We will require a code editor for updating and packaging our code, so kindly install Visual Studio Code on your local machine.


3. Install Yeoman and gulp

Install Yeoman as it will help you to package and is a perfect tool to preview your coding aspects. SharePoint client-side development tools include a Yeoman generator for creating new web parts on SharePoint premise and Online Servers. The generator provides a playground dev environment website called as Workbench to host the web parts for testing which is so easy for our code testing.


How to install

  • Open Command Prompt on your machine.

  • Run the following command

npm install -g yo gulp


  • Once the execution is completed, run the following code to install the SharePoint Framework Yeoman generator globally -

npm install -g @microsoft/generator-sharepoint


  • Once the above execution is completed, there might be scenarios where you want to switch between the different projects created using different versions of the SharePoint Framework Yeoman generator. In that case, you can install the generator locally as a development dependency in the project folder by executing the following command.

npm install @microsoft/generator-sharepoint --save-dev


The above installation will take some time. Once all the above installations are completed, we will be ready with the new playground development.

That's it. We will learn new amazing features of SharePoint in my upcoming articles. Until then, keep learning!