All of us might be using the SPFx for the SharePoint online for a long time. But setting up the SPFx on On-Prem is a bit different and there are few version conflicts are there. In this article, let us see how to setup the DEV Environment for the SPFx in On-Prem environment.
1. Create a new VM with Windows 10.
2. Install the Node.JS Version V8.17 (node-v8.17.0-x64)
3. npm install –global gulp@3.9.1
4. npm install –global yo@3.1.1
5. npm install -g @microsoft/generator-sharepoint
6. npm install –global –production windows-build-tools — This will take more time. Once we see the status as installed on the screen, we can stop this by Ctrl+C
7. yo @microsoft/sharepoint
8. gulp trust-dev-cert
9. npm shrinkwrap
10. npm install react-quill –save
11. npm install jquery –save
12. npm i sp-pnp-js –save instead of @pnp/sp
We cant use the pnp package as below. I tried and uninstalled.
1. npm i @pnp/sp@1.3.11
2. npm uninstall @pnp/logging @pnp/common @pnp/odata @pnp/sp
The above will ensure that the SPFx version is 1.4.1.
My Package.json will looks like below.
{ "name": "my Onprem webparts solution", "version": "0.0.1", "private": true, "main": "lib/index.js", "scripts": { "build": "gulp bundle", "clean": "gulp clean", "test": "gulp test" }, "dependencies": { "@microsoft/sp-core-library": "~1.4.0", "@microsoft/sp-lodash-subset": "~1.4.0", "@microsoft/sp-office-ui-fabric-core": "~1.4.0", "@microsoft/sp-webpart-base": "~1.4.0", "jquery": "^3.6.0", "moment": "^2.29.1", "react": "15.6.2", "react-dom": "15.6.2", "react-quill": "^1.3.5", "sp-pnp-js": "^3.0.10" }, "devDependencies": { "@types/react": "15.6.6", "@types/react-dom": "15.5.6", "@microsoft/sp-build-web": "~1.4.1", "@microsoft/sp-module-interfaces": "~1.4.1", "@microsoft/sp-webpart-workbench": "~1.4.1", "gulp": "~3.9.1", "ajv": "~5.2.2", "@types/webpack-env": "1.13.1" } }
Happy Coding
Sathish Nadarajan
Leave a comment