There are many threads and answers regarding this question. But i didn't find a satisfying answer.
I am currently working on a SPA for SharePoint 2016 OnPrem. I scaffolded my Project with the Yeoman Generator from PNP SPFx Generator version 1.8 . So my SPFx Version is caped at 1.1.0. because that's the highest Version SP2016 OnPrem is supporting. But sadly it didn't install Fabric UI React on its own, so i don't know which Fabric Ui React Version is the highest supported one.
So i did the following steps:
- I did the workaround to get the internal microsoft gulp builder to use Typescript 2.4.2 (Workaround for SPFx TypeScript Version)
- I found someone telling that only "office-ui-fabric-react": "2.34.2" will work for my SPFx Version so i installed that (that was an old comment on another github issue i found but can't recall the url/issue).
After that i encountered an old bug in Fabric UI (a Chrome problem with drag&drop) so i went on to find a solution to upgrade Fabric UI.
Now i got it pumped up to:
{
"name": "timeplan",
"version": "0.0.1",
"private": true,
"main": "lib/index.js",
"engines": {
"node": ">=0.10.0"
},
"scripts": {
"build": "gulp bundle",
"clean": "gulp clean",
"test": "gulp test",
"preversion": "node ./tools/pre-version.js",
"postversion": "gulp dist"
},
"dependencies": {
"@microsoft/sp-core-library": "~1.1.0",
"@microsoft/sp-lodash-subset": "~1.1.0",
"@microsoft/sp-office-ui-fabric-core": "~1.4.0-0",
"@microsoft/sp-webpart-base": "~1.1.0",
"@pnp/common": "^1.3.6",
"@pnp/logging": "^1.3.6",
"@pnp/odata": "^1.3.6",
"@pnp/pnpjs": "^1.3.5",
"@pnp/sp": "^1.3.6",
"@types/es6-promise": "0.0.33",
"@types/react": "^16.9.12",
"@types/webpack-env": "1.13.1",
"office-ui-fabric-react": "5.135.3",
"react": "15.4.2",
"react-dom": "15.4.2",
"react-router-dom": "^5.1.2"
},
"resolutions": {
"@types/react": "15.0.29"
},
"devDependencies": {
"@microsoft/sp-build-web": "~1.1.0",
"@microsoft/sp-module-interfaces": "~1.1.0",
"@microsoft/sp-webpart-workbench": "~1.1.0",
"@types/chai": "3.4.34",
"@types/mocha": "2.2.38",
"ajv": "~5.2.2",
"gulp": "~3.9.1",
"gulp-sequence": "1.0.0",
"typescript": "^2.4.2"
}
}
My gulp task builds and even serves it. But i got sometimes strange Type mismatches regarding JSX in the Render function of my code.
Does someone know the golden Rule for the versions for SPFx(1.1.0) + Fabric UI + React + Typescript(2.4.2) ? Whats the highest i can go with this setup ?
