How To Set Up Development Environment For SharePoint Framework

SharePont Framework

SharePoint Framework (SPFx) is a page and Web part model, which provides full support for client-side SharePoint development, easy integration with SharePoint data and support for open source tooling. With SharePoint Framework, you can use modern Web technologies and tools in your preferred development environment to build productive experiences and apps, which are responsive and mobile-ready from day one. SharePoint Framework works for SharePoint On-Premises and SharePoint Online. For more details, refer Overview of the SharePoint Framework.

Install Dev Tools


Node.js is a JavaScript runtime built on Chrome's V8 JavaScript engine. Node.js uses an event-driven, non-blocking I/O model, which makes it lightweight and efficient. Node.js' package ecosystem, npm, is the largest ecosystem of open source libraries in the world.


Node Package Manager (npm) is used to install the packages, which you want to use and provide a useful interface to work with them.

Install Node.js and NPM

Visual Studio Code

Install VS Code

Install Yeoman and Gulp

Yeoman helps you to kick start new projects, prescribing best practices and tools to help you stay productive.

Use the console command given below to install Yeoman and Gulp.

npm i -g yo gulp

Install Yeoman SharePoint Generator

Yeoman SharePoint Web Part generator allows you to quickly create a SharePoint client-side solution projects with the right tool chain and the project structure.

Use the console command given below to install SharePoint generator:

npm i -g @microsoft/generator-sharepoint@latest


In this blog, you have seen how to set up development environment for SharePoint Framework.