Install Node.js
Node.js is available in two different releases: the long term support release (aka: LTS) is the most stable version that is recommended for most users while the current version contains the latest features.
Before installing Node.js, you should verify that you haven’t installed it previously. Open a command prompt or terminal (depending on your developer platform) and execute the following command:
node -v
If a version number is returned, you already have Node.js. The version(s) of Node.js you may use depends on the environment(s) you’ll be targeting.
SharePoint Online always uses the latest version of the SharePoint Framework, but SharePoint 2016 and SharePoint 2019 only support the versions that match the server-side dependencies of the deployed packages.
| SharePoint version | Supported SPFx version | Supported features |
|---|---|---|
| SharePoint Online | All versions | All features |
| SharePoint Server Subscription Edition | v1.4.1 or lower | SPFx client-side web parts in classic and modern pages, and extensions in modern pages. |
| SharePoint Server 2019 | v1.4.1 or lower | SPFx client-side web parts in classic and modern pages, and extensions in modern pages. |
| SharePoint 2016 Feature Pack 2 | v1.1 | SPFx client-side web parts hosted in classic SharePoint pages. |
For more information about SharePoint Framework development with SharePoint 2016 Feature Pack 2 and SharePoint 2019, see:
- SharePoint Framework development with SharePoint 2016 Feature Pack 2
- SharePoint Framework development with SharePoint Server 2019 – this guidance applies also for SharePoint Server Subscription Edition
SPFx development environment compatibility
As each new version of the SharePoint Framework is released, support for newer versions libraries is constantly added to ensure that the toolset remains up to date.
The following table lists SharePoint Framework and compatible versions of common tools and libraries:
| SPFx | Node.js (LTS) | NPM | TypeScript | React |
|---|---|---|---|---|
| 1.16.1 | v16.13+ | v5, v6, v7, v8 | v4.5 | v17.0.1 |
| 1.16.0 | v16.13+ | v5, v6, v7, v8 | v4.5 | v17.0.1 |
| 1.15.2 | v12, v14, v16 | v5, v6, v7, v8 | v4.5 | v16.13.1 |
| 1.15.0 | v12, v14, v16 | v5, v6, v7, v8 | v4.5 | v16.13.1 |
| 1.14.0 | v12, v14 | v5, v6 | v3.9 | v16.13.1 |
| 1.13.1 | v12, v14 | v5, v6 | v3.9 | v16.13.1 |
| 1.13.0 | v12, v14 | v5, v6 | v3.9 | v16.13.1 |
| 1.12.1 | v10, v12, v14 | v5, v6 | v3.7 | v16.9.0 |
| 1.11.0 | v10 | v5, v6 | v3.3 | v16.8.5 |
| 1.10.0 | v8, v10 | v5, v6 | v3.3 | v16.8.5 |
| 1.9.1 | v8, v10 | v5, v6 | v2.9 | v16.8.5 |
| 1.8.2 | v8, v10 | v5, v6 | v2.9 | v16.7.0 |
| 1.8.1 | v8 | v5, v6 | v2.7, v2.9, v3 | v16.7.0 |
| 1.8.0 | v8 | v5, v6 | v2.7, v2.9, v3 | v16.7.0 |
| 1.7.1 | v8 | v5, v6 | v2.4 | v16.3.2 |
| 1.7.0 | v8 | v5, v6 | v2.4 | v16.3.2 |
| 1.6.0 | v6, v8 | v3 (w/ Node.js 6), v5 (w/ Node.js 8) | v2.4 | v15 |
| 1.5.1 | v6, v8 | v3 (w/ Node.js 6), v5 (w/ Node.js 8) | v2.4 | v15 |
| 1.5.0 | v6, v8 | v3 (w/ Node.js 6), v5 (w/ Node.js 8) | v2.4 | v15 |
| 1.4.1 | v6, v8 | v3, v4 | v2.4 | v15 |
| 1.4.0 | v6 | v3, v4 | v2.4 | v15 |
| 1.3.0 | v6 | v3, v4 | v2.4 | v15 |
| 1.1.0 | v6 | v3, v4 | v2.4 | v15 |
| 1.0.0 | v6 | v3 | v2.4 | v15 |
If you already have a version of Node.js that’s compatible with the environment(s) you’ll be targeting, then skip to the next section.
Open a browser and navigate to the Node.js Foundation site: https://www.nodejs.org. The current LTS version may not be compatible with the current version of the SharePoint Framework, so you’ll navigate further into the site to ensure you download the appropriate installer. Select Downloads from the top menu navigation then scroll to the bottom of the page and select Previous Releases. Download the appropriate installer or binary for the platform you’re using. Run the installer, accepting all the default options. This will install Node.js and npm Node Package Manager.
Install Yeoman
Yeoman is a scaffolding engine, which executes generators that prompt the user with questions. Based on the answers to these questions, Yeoman then creates the folders and files defined by the generator.
Open a command prompt / terminal window and execute the following command to install Yeoman globally with npm:
npm install –global yo
Install Gulp CLI
Gulp is a task runner utility. It’s similar to MSBuild, a tool used by .NET developers and Visual Studio to compile projects, package solutions, and start a debugging experience.
If you previously installed Gulp globally, you need to uninstall it before installing Gulp CLI
npm uninstall –global gulp
To install Gulp CLI, open a command prompt / terminal window and execute the following command:
npm install –global gulp-cli
Install the SharePoint Framework Yeoman generator
Microsoft has created a Yeoman generator for scaffolding SharePoint Framework projects.
To install the latest version of the SharePoint Framework Yeoman generator globally with npm, open a command prompt / terminal window and execute the following command:
npm install –global @microsoft/generator-sharepoint
To install a specific version of the SharePoint Framework Yeoman generator globally with npm, open a command prompt / terminal window and execute the following command:
npm install –global @microsoft/generator-sharepoint@[version number]
npm install –global @microsoft/generator-sharepoint@1.9.1
Final Check to list all that we have installed:
npm list -g –depth=0
Vikas D More 