From ff946c9f4b76d10eafc0eb0bf8c25189368d43bb Mon Sep 17 00:00:00 2001 From: Ari Gunawan Date: Sun, 23 May 2021 14:58:50 +0700 Subject: [PATCH] Replace sp-pnp-js with pnp/sp --- samples/react-pagecontributors/README.md | 50 +- .../config/package-solution.json | 2 +- .../react-pagecontributors/package-lock.json | 92 +- samples/react-pagecontributors/package.json | 2 +- .../PageContributorsWebPart.ts | 18 +- .../components/PageContributors.tsx | 8 +- .../react-pagecontributors/upgrade-report.md | 1802 ----------------- 7 files changed, 112 insertions(+), 1862 deletions(-) delete mode 100644 samples/react-pagecontributors/upgrade-report.md diff --git a/samples/react-pagecontributors/README.md b/samples/react-pagecontributors/README.md index 98c9fac52..b34c2f63c 100644 --- a/samples/react-pagecontributors/README.md +++ b/samples/react-pagecontributors/README.md @@ -22,42 +22,42 @@ Displays page contributors in reverse chronological order. ![Organisation Chart for the current user running in local Workbench](./assets/pagecontributors_mockup.PNG) -## Used SharePoint Framework Version -![drop](https://img.shields.io/badge/version-GA-green.svg) + +## Compatibility + +![SPFx 1.12.1](https://img.shields.io/badge/SPFx-1.12.1-green.svg) +![Node.js LTS 10.x](https://img.shields.io/badge/Node.js-LTS%2010.x-green.svg) +![SharePoint Online](https://img.shields.io/badge/SharePoint-Online-yellow.svg) +![Teams N/A: Untested with Microsoft Teams](https://img.shields.io/badge/Teams-N%2FA-lightgrey.svg "Untested with Microsoft Teams") +![Workbench Local | Hosted](https://img.shields.io/badge/Workbench-Local%20%7C%20Hosted-green.svg) + ## Applies to * [SharePoint Framework](https://docs.microsoft.com/sharepoint/dev/spfx/sharepoint-framework-overview) -* [Office 365 tenant](https://docs.microsoft.com/sharepoint/dev/spfx/set-up-your-development-environment) +* [Microsoft 365 tenant](https://docs.microsoft.com/sharepoint/dev/spfx/set-up-your-development-environment) -## Prerequisites - -PnP-JS-Core - ## Solution Solution|Author(s) --------|--------- PageContributors | Stéphane Magne ([@SPParse](https://twitter.com/SPParse)) +PageContributors | Ari Gunawan ([@arigunawan3023](https://twitter.com/arigunawan3023)) ## Version history Version|Date|Comments -------|----|-------- -1.0|July 27, 2017|Initial release - -## Disclaimer -**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.** - ---- +1.0.0|July 27, 2017|Initial release +1.1.0|May 23, 2021|Update SPFx (v1.12.1) version and replace sp-pnp-js with @pnp/sp (v2.5) ## Minimal Path to Awesome -- Clone this repository -- in the command line run: - - `npm install` - - `gulp serve` +* Clone this repository +* in the command line run: + * `npm install` + * `gulp serve` ## Features @@ -70,6 +70,20 @@ This Web Part illustrates the following concepts on top of the SharePoint Framew - Office UI Fabric - React -- Pnp JS Core +- PNP JS + +## Disclaimer + +**THIS CODE IS PROVIDED *AS IS* WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESS OR IMPLIED, INCLUDING ANY IMPLIED WARRANTIES OF FITNESS FOR A PARTICULAR PURPOSE, MERCHANTABILITY, OR NON-INFRINGEMENT.** + +## Support + +We do not support samples, but we do use GitHub to track issues and constantly want to improve these samples. + +If you encounter any issues while using this sample, [create a new issue](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=bug-report.yml&sample=YOUR-SOLUTION-NAME&authors=@YOURGITHUBUSERNAME&title=YOUR-SOLUTION-NAME%20-%20). + +For questions regarding this sample, [create a new question](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=question.yml&sample=YOUR-SOLUTION-NAME&authors=@YOURGITHUBUSERNAME&title=YOUR-SOLUTION-NAME%20-%20). + +Finally, if you have an idea for improvement, [make a suggestion](https://github.com/pnp/sp-dev-fx-webparts/issues/new?assignees=&labels=Needs%3A+Triage+%3Amag%3A%2Ctype%3Abug-suspected&template=suggestion.yml&sample=YOUR-SOLUTION-NAME&authors=@YOURGITHUBUSERNAME&title=YOUR-SOLUTION-NAME%20-%20). diff --git a/samples/react-pagecontributors/config/package-solution.json b/samples/react-pagecontributors/config/package-solution.json index 69368596c..1b0e6c0f0 100644 --- a/samples/react-pagecontributors/config/package-solution.json +++ b/samples/react-pagecontributors/config/package-solution.json @@ -3,7 +3,7 @@ "solution": { "name": "react-pagecontributors-client-side-solution", "id": "1c18830a-4c18-4b82-a571-77863b19c66d", - "version": "1.0.0.0", + "version": "1.1.0.0", "skipFeatureDeployment": true, "developer": { "name": "", diff --git a/samples/react-pagecontributors/package-lock.json b/samples/react-pagecontributors/package-lock.json index 9b9624263..7b8c16184 100644 --- a/samples/react-pagecontributors/package-lock.json +++ b/samples/react-pagecontributors/package-lock.json @@ -1673,11 +1673,6 @@ "isomorphic-fetch": "^2.2.1" } }, - "@microsoft/microsoft-graph-types": { - "version": "1.1.0", - "resolved": "https://registry.npmjs.org/@microsoft/microsoft-graph-types/-/microsoft-graph-types-1.1.0.tgz", - "integrity": "sha1-CGRuRpJHpBRMcVFhoQgTh63nzTs=" - }, "@microsoft/node-core-library": { "version": "3.19.3", "resolved": "https://registry.npmjs.org/@microsoft/node-core-library/-/node-core-library-3.19.3.tgz", @@ -2832,6 +2827,71 @@ "integrity": "sha512-hZNKjKOYsckoOEgBziGMnBcX0M7EtstnCmwz5jZUOUYwlZ+/xxX6z3jPu1XVO2Jivk0eLfuP9GP+vFD49CMetw==", "dev": true }, + "@pnp/common": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/@pnp/common/-/common-2.5.0.tgz", + "integrity": "sha512-ea4zTNC3sjLolrHZXP+/2SrJM+yC8PygmPW/yRfgbErdvdwYMUSogT69dW+NUaqhkfYZfkkAoWn42irlLMSpdw==", + "requires": { + "tslib": "2.2.0" + }, + "dependencies": { + "tslib": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz", + "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==" + } + } + }, + "@pnp/logging": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/@pnp/logging/-/logging-2.5.0.tgz", + "integrity": "sha512-SnmMCN6oADjiHKAIR23FfTqXeQZeXPBnWeVfyZAgzJfRn9uEQoUlkyET3jHjl9kkrFOVkiOD1CRI7TWMIxURbA==", + "requires": { + "tslib": "2.2.0" + }, + "dependencies": { + "tslib": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz", + "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==" + } + } + }, + "@pnp/odata": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/@pnp/odata/-/odata-2.5.0.tgz", + "integrity": "sha512-AeP01jDvnkiUVn7V+4FT07chz+G/yzrJDH0Gk+qzujJ393ZO6FwJpJEiOCRh9cxF48gqSj/f7r/IIyDHe0+IpQ==", + "requires": { + "@pnp/common": "2.5.0", + "@pnp/logging": "2.5.0", + "tslib": "2.2.0" + }, + "dependencies": { + "tslib": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz", + "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==" + } + } + }, + "@pnp/sp": { + "version": "2.5.0", + "resolved": "https://registry.npmjs.org/@pnp/sp/-/sp-2.5.0.tgz", + "integrity": "sha512-4s2p+X5qvkXR72NViKb8DIfC+pvj/a3psZ3Im5PRIan2ErMtu9ch3Lb9nkSaMCF3NTJxWOhkUQ/R6tx8ApaUkg==", + "requires": { + "@pnp/common": "2.5.0", + "@pnp/logging": "2.5.0", + "@pnp/odata": "2.5.0", + "tslib": "2.2.0" + }, + "dependencies": { + "tslib": { + "version": "2.2.0", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.2.0.tgz", + "integrity": "sha512-gS9GVHRU+RGn5KQM2rllAlR3dU6m7AcpJKdtH8gFvQiC4Otgk98XnmMU+nZenHt/+VhnBPWwgrJsyrdcw6i23w==" + } + } + }, "@pnpm/error": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/@pnpm/error/-/error-1.4.0.tgz", @@ -3457,11 +3517,6 @@ "resolved": "https://registry.npmjs.org/@types/lodash/-/lodash-4.14.117.tgz", "integrity": "sha512-xyf2m6tRbz8qQKcxYZa7PA4SllYcay+eh25DN3jmNYY6gSTL7Htc/bttVdkqj2wfJGbeWlQiX8pIyJpKU+tubw==" }, - "@types/microsoft-ajax": { - "version": "0.0.36", - "resolved": "https://registry.npmjs.org/@types/microsoft-ajax/-/microsoft-ajax-0.0.36.tgz", - "integrity": "sha512-aQIlZ0LXpOaxjl0qQt6BoKI9lVPud5z5zxTY1LQBmqmZziryX0rRTHT56WjWTJqVj1M3ZrC/iR606ReuvFs3zA==" - }, "@types/minimatch": { "version": "3.0.4", "resolved": "https://registry.npmjs.org/@types/minimatch/-/minimatch-3.0.4.tgz", @@ -3584,14 +3639,6 @@ "integrity": "sha512-0caWDWmpCp0uifxFh+FaqK3CuZ2SkRR/ZRxAV5+zNdC3QVUi6wyOJnefhPvtNt8NQWXB5OA93BUvZsXpWat2Xw==", "dev": true }, - "@types/sharepoint": { - "version": "2013.1.9", - "resolved": "https://registry.npmjs.org/@types/sharepoint/-/sharepoint-2013.1.9.tgz", - "integrity": "sha512-OP3D/vKnOnZcRwTu2jdt7gp8AGDKx3jFoBHudR7UUX4IIwDqOPEJdkfvIpz/KiQbbbyvWS0PtvDz3iQ1HH/rcw==", - "requires": { - "@types/microsoft-ajax": "*" - } - }, "@types/source-list-map": { "version": "0.1.2", "resolved": "https://registry.npmjs.org/@types/source-list-map/-/source-list-map-0.1.2.tgz", @@ -18262,15 +18309,6 @@ "integrity": "sha512-cPiFOTLUKvJFIg4SKVScy4ilPPW6rFgMgfuZJPNoDuMs3nC1HbMUycBoJw77xFIp6z1UJQJOfx6C9GMH80DiTw==", "dev": true }, - "sp-pnp-js": { - "version": "3.0.10", - "resolved": "https://registry.npmjs.org/sp-pnp-js/-/sp-pnp-js-3.0.10.tgz", - "integrity": "sha1-Rm180DEgkNbEXTH20azoAgW9QjA=", - "requires": { - "@microsoft/microsoft-graph-types": "1.1.0", - "@types/sharepoint": "2013.1.9" - } - }, "sparkles": { "version": "1.0.1", "resolved": "https://registry.npmjs.org/sparkles/-/sparkles-1.0.1.tgz", diff --git a/samples/react-pagecontributors/package.json b/samples/react-pagecontributors/package.json index 298003c26..61f41d3b8 100644 --- a/samples/react-pagecontributors/package.json +++ b/samples/react-pagecontributors/package.json @@ -11,7 +11,7 @@ "office-ui-fabric-react": "7.156.0", "react": "16.9.0", "react-dom": "16.9.0", - "sp-pnp-js": "^3.0.10" + "@pnp/sp": "^2.5.0" }, "devDependencies": { "@microsoft/rush-stack-compiler-3.7": "0.2.3", diff --git a/samples/react-pagecontributors/src/webparts/pageContributors/PageContributorsWebPart.ts b/samples/react-pagecontributors/src/webparts/pageContributors/PageContributorsWebPart.ts index 94be2dc99..f9e36f30f 100644 --- a/samples/react-pagecontributors/src/webparts/pageContributors/PageContributorsWebPart.ts +++ b/samples/react-pagecontributors/src/webparts/pageContributors/PageContributorsWebPart.ts @@ -13,12 +13,12 @@ import * as strings from 'pageContributorsStrings'; import PageContributors from './components/PageContributors'; import { IPageContributorsWebPartProps } from './IPageContributorsWebPartProps'; import { PersonaSize } from "office-ui-fabric-react/lib/index"; -import pnp from 'sp-pnp-js'; +import { sp } from "@pnp/sp/presets/all"; export default class PagecontributionWebPart extends BaseClientSideWebPart { public onInit(): Promise { return super.onInit().then(_ => { - pnp.setup({ + sp.setup({ spfxContext: this.context }); }); @@ -56,13 +56,13 @@ export default class PagecontributionWebPart extends BaseClientSideWebPart { return new Promise((resolve, reject) => { - pnp.sp.web.getFileByServerRelativeUrl(pageServerRelativeUrl) + sp.web.getFileByServerRelativeUrl(pageServerRelativeUrl) .select('ModifiedBy') .expand('ModifiedBy') .get() .then(file => { - pnp.sp.web.getFileByServerRelativeUrl(pageServerRelativeUrl) + sp.web.getFileByServerRelativeUrl(pageServerRelativeUrl) .versions .orderBy('Created') .select('ID, Created, CreatedBy') @@ -71,7 +71,7 @@ export class PageContributorsService { let history = versions.map((version) => { return new PageContributor(version.CreatedBy); }); - history.unshift(new PageContributor(file.ModifiedBy)); + history.unshift(new PageContributor(file['ModifiedBy'])); history = RemoveDuplicates(history); resolve(history); }); diff --git a/samples/react-pagecontributors/upgrade-report.md b/samples/react-pagecontributors/upgrade-report.md deleted file mode 100644 index 54e82d3b9..000000000 --- a/samples/react-pagecontributors/upgrade-report.md +++ /dev/null @@ -1,1802 +0,0 @@ -# Upgrade project Source to v1.12.1 - -Date: 5/21/2021 - -## Findings - -Following is the list of steps required to upgrade your project to SharePoint Framework version 1.12.1. [Summary](#Summary) of the modifications is included at the end of the report. - -### FN001001 @microsoft/sp-core-library | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-core-library - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-core-library@1.12.1 -``` - -File: [./package.json:9:5](./package.json) - -### FN001004 @microsoft/sp-webpart-base | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-webpart-base - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-webpart-base@1.12.1 -``` - -File: [./package.json:10:5](./package.json) - -### FN001021 @microsoft/sp-property-pane | Required - -Install SharePoint Framework dependency package @microsoft/sp-property-pane - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-property-pane@1.12.1 -``` - -File: [./package.json:8:3](./package.json) - -### FN002001 @microsoft/sp-build-web | Required - -Upgrade SharePoint Framework dev dependency package @microsoft/sp-build-web - -Execute the following command: - -```sh -npm i -DE @microsoft/sp-build-web@1.12.1 -``` - -File: [./package.json:22:5](./package.json) - -### FN002002 @microsoft/sp-module-interfaces | Required - -Upgrade SharePoint Framework dev dependency package @microsoft/sp-module-interfaces - -Execute the following command: - -```sh -npm i -DE @microsoft/sp-module-interfaces@1.12.1 -``` - -File: [./package.json:23:5](./package.json) - -### FN002003 @microsoft/sp-webpart-workbench | Required - -Upgrade SharePoint Framework dev dependency package @microsoft/sp-webpart-workbench - -Execute the following command: - -```sh -npm i -DE @microsoft/sp-webpart-workbench@1.12.1 -``` - -File: [./package.json:24:5](./package.json) - -### FN002009 @microsoft/sp-tslint-rules | Required - -Install SharePoint Framework dev dependency package @microsoft/sp-tslint-rules - -Execute the following command: - -```sh -npm i -DE @microsoft/sp-tslint-rules@1.12.1 -``` - -File: [./package.json:21:3](./package.json) - -### FN004002 copy-assets.json deployCdnPath | Required - -Update copy-assets.json deployCdnPath - -```json -{ - "deployCdnPath": "./release/assets/" -} -``` - -File: [./config/copy-assets.json:2:3](./config/copy-assets.json) - -### FN005002 deploy-azure-storage.json workingDir | Required - -Update deploy-azure-storage.json workingDir - -```json -{ - "workingDir": "./release/assets/" -} -``` - -File: [./config/deploy-azure-storage.json:2:3](./config/deploy-azure-storage.json) - -### FN010001 .yo-rc.json version | Recommended - -Update version in .yo-rc.json - -```json -{ - "@microsoft/generator-sharepoint": { - "version": "1.12.1" - } -} -``` - -File: [./.yo-rc.json:3:5](./.yo-rc.json) - -### FN023001 .gitignore 'release' folder | Required - -To .gitignore add the 'release' folder - - -File: [./.gitignore](./.gitignore) - -### FN001008 react | Required - -Upgrade SharePoint Framework dependency package react - -Execute the following command: - -```sh -npm i -SE react@16.9.0 -``` - -File: [./package.json:17:5](./package.json) - -### FN001009 react-dom | Required - -Upgrade SharePoint Framework dependency package react-dom - -Execute the following command: - -```sh -npm i -SE react-dom@16.9.0 -``` - -File: [./package.json:18:5](./package.json) - -### FN001022 office-ui-fabric-react | Required - -Install SharePoint Framework dependency package office-ui-fabric-react - -Execute the following command: - -```sh -npm i -SE office-ui-fabric-react@7.156.0 -``` - -File: [./package.json:8:3](./package.json) - -### FN002004 gulp | Required - -Upgrade SharePoint Framework dev dependency package gulp - -Execute the following command: - -```sh -npm i -DE gulp@4.0.2 -``` - -File: [./package.json:25:5](./package.json) - -### FN002005 @types/chai | Required - -Remove SharePoint Framework dev dependency package @types/chai - -Execute the following command: - -```sh -npm un -D @types/chai -``` - -File: [./package.json:26:5](./package.json) - -### FN002006 @types/mocha | Required - -Remove SharePoint Framework dev dependency package @types/mocha - -Execute the following command: - -```sh -npm un -D @types/mocha -``` - -File: [./package.json:27:5](./package.json) - -### FN002017 @microsoft/rush-stack-compiler-3.7 | Required - -Install SharePoint Framework dev dependency package @microsoft/rush-stack-compiler-3.7 - -Execute the following command: - -```sh -npm i -DE @microsoft/rush-stack-compiler-3.7@0.2.3 -``` - -File: [./package.json:21:3](./package.json) - -### FN002015 @types/react | Required - -Install SharePoint Framework dev dependency package @types/react - -Execute the following command: - -```sh -npm i -DE @types/react@16.9.36 -``` - -File: [./package.json:21:3](./package.json) - -### FN002016 @types/react-dom | Required - -Install SharePoint Framework dev dependency package @types/react-dom - -Execute the following command: - -```sh -npm i -DE @types/react-dom@16.9.8 -``` - -File: [./package.json:21:3](./package.json) - -### FN012017 tsconfig.json extends property | Required - -Update tsconfig.json extends property - -```json -{ - "extends": "./node_modules/@microsoft/rush-stack-compiler-3.7/includes/tsconfig-web.json" -} -``` - -File: [./tsconfig.json:1:1](./tsconfig.json) - -### FN012018 tsconfig.json es2015.promise lib | Required - -Add es2015.promise lib in tsconfig.json - -```json -{ - "compilerOptions": { - "lib": [ - "es2015.promise" - ] - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012019 tsconfig.json es6-promise types | Required - -Remove es6-promise type in tsconfig.json - -```json -{ - "compilerOptions": { - "types": [ - "es6-promise" - ] - } -} -``` - -File: [./tsconfig.json:11:7](./tsconfig.json) - -### FN013002 gulpfile.js serve task | Required - -Before 'build.initialize(require('gulp'));' add the serve task - -```js -var getTasks = build.rig.getTasks; -build.rig.getTasks = function () { - var result = getTasks.call(build.rig); - - result.set('serve', result.get('serve-deprecated')); - - return result; -}; - -``` - -File: [./gulpfile.js](./gulpfile.js) - -### FN015006 .editorconfig | Required - -Remove file .editorconfig - -Execute the following command: - -```sh -rm ".editorconfig" -``` - -File: [.editorconfig](.editorconfig) - -### FN019002 tslint.json extends | Required - -Update tslint.json extends property - -```json -{ - "extends": "./node_modules/@microsoft/sp-tslint-rules/base-tslint.json" -} -``` - -File: [./tslint.json:1:1](./tslint.json) - -### FN021002 engines | Required - -Remove package.json property - -```json -{ - "engines": "undefined" -} -``` - -File: [./package.json:5:3](./package.json) - -### FN001005 @types/react | Required - -Remove SharePoint Framework dependency package @types/react - -Execute the following command: - -```sh -npm un -S @types/react -``` - -File: [./package.json:11:5](./package.json) - -### FN001006 @types/react-dom | Required - -Remove SharePoint Framework dependency package @types/react-dom - -Execute the following command: - -```sh -npm un -S @types/react-dom -``` - -File: [./package.json:15:5](./package.json) - -### FN001007 @types/webpack-env | Required - -Remove SharePoint Framework dependency package @types/webpack-env - -Execute the following command: - -```sh -npm un -S @types/webpack-env -``` - -File: [./package.json:16:5](./package.json) - -### FN002013 @types/webpack-env | Required - -Install SharePoint Framework dev dependency package @types/webpack-env - -Execute the following command: - -```sh -npm i -DE @types/webpack-env@1.13.1 -``` - -File: [./package.json:21:3](./package.json) - -### FN002014 @types/es6-promise | Required - -Install SharePoint Framework dev dependency package @types/es6-promise - -Execute the following command: - -```sh -npm i -DE @types/es6-promise@0.0.33 -``` - -File: [./package.json:21:3](./package.json) - -### FN006004 package-solution.json developer | Optional - -In package-solution.json add developer section - -```json -{ - "solution": { - "developer": { - "name": "Contoso", - "privacyUrl": "https://contoso.com/privacy", - "termsOfUseUrl": "https://contoso.com/terms-of-use", - "websiteUrl": "https://contoso.com/my-app", - "mpnId": "000000" - } - } -} -``` - -File: [./config/package-solution.json:2:3](./config/package-solution.json) - -### FN012012 tsconfig.json include property | Required - -Add to the tsconfig.json include property - -```json -{ - "include": [ - "src/**/*.tsx" - ] -} -``` - -File: [./tsconfig.json:1:1](./tsconfig.json) - -### FN016004 Property pane property import change to @microsoft/sp-property-pane | Required - -Refactor the code to import property pane property from the @microsoft/sp-property-pane npm package instead of the @microsoft/sp-webpart-base package - -```ts -import { BaseClientSideWebPart } from "@microsoft/sp-webpart-base"; -import { IPropertyPaneConfiguration, PropertyPaneSlider, PropertyPaneDropdown, PropertyPaneTextField } from "@microsoft/sp-property-pane"; -``` - -File: [src\webparts\pageContributors\PageContributorsWebPart.ts:4:1](src\webparts\pageContributors\PageContributorsWebPart.ts) - -### FN020001 @types/react | Required - -Add resolution for package @types/react - -```json -{ - "resolutions": { - "@types/react": "16.8.8" - } -} -``` - -File: [./package.json:1:1](./package.json) - -### FN021001 main | Required - -Add package.json property - -```json -{ - "main": "lib/index.js" -} -``` - -File: [./package.json:1:1](./package.json) - -### FN011011 Web part manifest supportedHosts | Required - -Update the supportedHosts property in the manifest - -```json -{ - "supportedHosts": ["SharePointWebPart"] -} -``` - -File: [src\webparts\pageContributors\PageContributorsWebPart.manifest.json:1:1](src\webparts\pageContributors\PageContributorsWebPart.manifest.json) - -### FN012014 tsconfig.json compiler options inlineSources | Required - -Update tsconfig.json inlineSources value - -```json -{ - "compilerOptions": { - "inlineSources": false - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012015 tsconfig.json compiler options strictNullChecks | Required - -Update tsconfig.json strictNullChecks value - -```json -{ - "compilerOptions": { - "strictNullChecks": false - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012016 tsconfig.json compiler options noUnusedLocals | Required - -Update tsconfig.json noUnusedLocals value - -```json -{ - "compilerOptions": { - "noUnusedLocals": false - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN018001 Web part Microsoft Teams tab resources folder | Optional - -Create folder for Microsoft Teams tab resources - -Execute the following command: - -```sh -mkdir "D:\project\sharing minds\source\Subscription Engine\External WebParts\Page Contributors\Source/teams" -``` - -File: [teams](teams) - -### FN018003 Web part Microsoft Teams tab small icon | Optional - -Create Microsoft Teams tab small icon for the web part - -Execute the following command: - -```sh -cp "C:\Users\Ari\AppData\Roaming\nvm\v10.20.1\node_modules\@pnp\cli-microsoft365\dist\m365\spfx\commands\project\project-upgrade\assets\tab20x20.png" "D:\project\sharing minds\source\Subscription Engine\External WebParts\Page Contributors\Source\teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_outline.png" -``` - -File: [teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_outline.png](teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_outline.png) - -### FN018004 Web part Microsoft Teams tab large icon | Optional - -Create Microsoft Teams tab large icon for the web part - -Execute the following command: - -```sh -cp "C:\Users\Ari\AppData\Roaming\nvm\v10.20.1\node_modules\@pnp\cli-microsoft365\dist\m365\spfx\commands\project\project-upgrade\assets\tab96x96.png" "D:\project\sharing minds\source\Subscription Engine\External WebParts\Page Contributors\Source\teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_color.png" -``` - -File: [teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_color.png](teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_color.png) - -### FN006003 package-solution.json isDomainIsolated | Required - -Update package-solution.json isDomainIsolated - -```json -{ - "solution": { - "isDomainIsolated": false - } -} -``` - -File: [./config/package-solution.json:2:15](./config/package-solution.json) - -### FN010007 .yo-rc.json isDomainIsolated | Recommended - -Update isDomainIsolated in .yo-rc.json - -```json -{ - "@microsoft/generator-sharepoint": { - "isDomainIsolated": false - } -} -``` - -File: [./.yo-rc.json:2:38](./.yo-rc.json) - -### FN019001 tslint.json rulesDirectory | Required - -Remove rulesDirectory from tslint.json - -```json -{ - "rulesDirectory": [] -} -``` - -File: [./tslint.json:2:5](./tslint.json) - -### FN002008 tslint-microsoft-contrib | Required - -Install SharePoint Framework dev dependency package tslint-microsoft-contrib - -Execute the following command: - -```sh -npm i -DE tslint-microsoft-contrib@5.0.0 -``` - -File: [./package.json:21:3](./package.json) - -### FN012011 tsconfig.json compiler options outDir | Required - -Update tsconfig.json outDir value - -```json -{ - "compilerOptions": { - "outDir": "lib" - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012013 tsconfig.json exclude property | Required - -Update tsconfig.json exclude property - -```json -{ - "exclude": [ - "node_modules", - "lib" - ] -} -``` - -File: [./tsconfig.json:1:1](./tsconfig.json) - -### FN015004 config\tslint.json | Required - -Remove file config\tslint.json - -Execute the following command: - -```sh -rm "config\tslint.json" -``` - -File: [config\tslint.json](config\tslint.json) - -### FN015005 src\index.ts | Required - -Add file src\index.ts - -Execute the following command: - -```sh -cat > "src\index.ts" << EOF -// A file is required to be in the root of the /src directory by the TypeScript compiler - -EOF -``` - -File: [src\index.ts](src\index.ts) - -### FN001010 @types/es6-promise | Required - -Install SharePoint Framework dependency package @types/es6-promise - -Execute the following command: - -```sh -npm i -SE @types/es6-promise@0.0.33 -``` - -File: [./package.json:8:3](./package.json) - -### FN003001 config.json schema | Required - -Update config.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/config.2.0.schema.json" -} -``` - -File: [./config/config.json:1:1](./config/config.json) - -### FN004001 copy-assets.json schema | Required - -Update copy-assets.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/copy-assets.schema.json" -} -``` - -File: [./config/copy-assets.json:1:1](./config/copy-assets.json) - -### FN005001 deploy-azure-storage.json schema | Required - -Update deploy-azure-storage.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json" -} -``` - -File: [./config/deploy-azure-storage.json:1:1](./config/deploy-azure-storage.json) - -### FN006001 package-solution.json schema | Required - -Update package-solution.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json" -} -``` - -File: [./config/package-solution.json:1:1](./config/package-solution.json) - -### FN007001 serve.json schema | Required - -Update serve.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json" -} -``` - -File: [./config/serve.json:1:1](./config/serve.json) - -### FN009001 write-manifests.json schema | Required - -Update write-manifests.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json" -} -``` - -File: [./config/write-manifests.json:1:1](./config/write-manifests.json) - -### FN010002 .yo-rc.json isCreatingSolution | Recommended - -Update isCreatingSolution in .yo-rc.json - -```json -{ - "@microsoft/generator-sharepoint": { - "isCreatingSolution": true - } -} -``` - -File: [./.yo-rc.json:2:38](./.yo-rc.json) - -### FN010003 .yo-rc.json packageManager | Recommended - -Update packageManager in .yo-rc.json - -```json -{ - "@microsoft/generator-sharepoint": { - "packageManager": "npm" - } -} -``` - -File: [./.yo-rc.json:2:38](./.yo-rc.json) - -### FN010004 .yo-rc.json componentType | Recommended - -Update componentType in .yo-rc.json - -```json -{ - "@microsoft/generator-sharepoint": { - "componentType": "webpart" - } -} -``` - -File: [./.yo-rc.json:2:38](./.yo-rc.json) - -### FN011001 Web part manifest schema | Required - -Update schema in manifest - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx/client-side-web-part-manifest.schema.json" -} -``` - -File: [src\webparts\pageContributors\PageContributorsWebPart.manifest.json:2:3](src\webparts\pageContributors\PageContributorsWebPart.manifest.json) - -### FN012001 tsconfig.json module | Required - -Update module type in tsconfig.json - -```json -{ - "compilerOptions": { - "module": "esnext" - } -} -``` - -File: [./tsconfig.json:5:5](./tsconfig.json) - -### FN012002 tsconfig.json moduleResolution | Required - -Update moduleResolution in tsconfig.json - -```json -{ - "compilerOptions": { - "moduleResolution": "node" - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN001015 @types/react-addons-shallow-compare | Required - -Remove SharePoint Framework dependency package @types/react-addons-shallow-compare - -Execute the following command: - -```sh -npm un -S @types/react-addons-shallow-compare -``` - -File: [./package.json:12:5](./package.json) - -### FN001016 @types/react-addons-update | Required - -Remove SharePoint Framework dependency package @types/react-addons-update - -Execute the following command: - -```sh -npm un -S @types/react-addons-update -``` - -File: [./package.json:14:5](./package.json) - -### FN001017 @types/react-addons-test-utils | Required - -Remove SharePoint Framework dependency package @types/react-addons-test-utils - -Execute the following command: - -```sh -npm un -S @types/react-addons-test-utils -``` - -File: [./package.json:13:5](./package.json) - -### FN006002 package-solution.json includeClientSideAssets | Required - -Update package-solution.json includeClientSideAssets - -```json -{ - "solution": { - "includeClientSideAssets": true - } -} -``` - -File: [./config/package-solution.json:2:15](./config/package-solution.json) - -### FN012003 tsconfig.json skipLibCheck | Required - -Update skipLibCheck in tsconfig.json - -```json -{ - "compilerOptions": { - "skipLibCheck": true - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012004 tsconfig.json typeRoots ./node_modules/@types | Required - -Add ./node_modules/@types to typeRoots in tsconfig.json - -```json -{ - "compilerOptions": { - "typeRoots": [ - "./node_modules/@types" - ] - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012005 tsconfig.json typeRoots ./node_modules/@microsoft | Required - -Add ./node_modules/@microsoft to typeRoots in tsconfig.json - -```json -{ - "compilerOptions": { - "typeRoots": [ - "./node_modules/@microsoft" - ] - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012006 tsconfig.json es6-collections types | Required - -Remove es6-collections type in tsconfig.json - -```json -{ - "compilerOptions": { - "types": [ - "es6-collections" - ] - } -} -``` - -File: [./tsconfig.json:12:7](./tsconfig.json) - -### FN012007 tsconfig.json es5 lib | Required - -Add es5 lib in tsconfig.json - -```json -{ - "compilerOptions": { - "lib": [ - "es5" - ] - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012008 tsconfig.json dom lib | Required - -Add dom lib in tsconfig.json - -```json -{ - "compilerOptions": { - "lib": [ - "dom" - ] - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN012009 tsconfig.json es2015.collection lib | Required - -Add es2015.collection lib in tsconfig.json - -```json -{ - "compilerOptions": { - "lib": [ - "es2015.collection" - ] - } -} -``` - -File: [./tsconfig.json:2:22](./tsconfig.json) - -### FN013001 gulpfile.js ms-Grid sass suppression | Recommended - -Add suppression for ms-Grid sass warning - -```js -build.addSuppression(`Warning - [sass] The local CSS class 'ms-Grid' is not camelCase and will not be type-safe.`); -``` - -File: [./gulpfile.js](./gulpfile.js) - -### FN002007 ajv | Required - -Install SharePoint Framework dev dependency package ajv - -Execute the following command: - -```sh -npm i -DE ajv@5.2.2 -``` - -File: [./package.json:21:3](./package.json) - -### FN014002 .vscode/extensions.json | Recommended - -In the .vscode folder, add the extensions.json file - -```json -{ - "recommendations": [ - "msjsdiag.debugger-for-chrome" - ] -} -``` - -File: [.vscode/extensions.json](.vscode/extensions.json) - -### FN014003 .vscode/launch.json | Recommended - -In the .vscode folder, add the launch.json file - -```json -{ - /** - Install Chrome Debugger Extension for Visual Studio Code - to debug your components with the Chrome browser: - https://aka.ms/spfx-debugger-extensions - */ - "version": "0.2.0", - "configurations": [{ - "name": "Local workbench", - "type": "chrome", - "request": "launch", - "url": "https://localhost:4321/temp/workbench.html", - "webRoot": "${workspaceRoot}", - "sourceMaps": true, - "sourceMapPathOverrides": { - "webpack:///../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../../src/*": "${webRoot}/src/*" - }, - "runtimeArgs": [ - "--remote-debugging-port=9222" - ] - }, - { - "name": "Hosted workbench", - "type": "chrome", - "request": "launch", - "url": "https://enter-your-SharePoint-site/_layouts/workbench.aspx", - "webRoot": "${workspaceRoot}", - "sourceMaps": true, - "sourceMapPathOverrides": { - "webpack:///../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../../src/*": "${webRoot}/src/*" - }, - "runtimeArgs": [ - "--remote-debugging-port=9222", - "-incognito" - ] - } - ] -} -``` - -File: [.vscode/launch.json](.vscode/launch.json) - -### FN011005 Web part manifest default group | Required - -In the manifest update the default group value - -```json -{ - "preconfiguredEntries": [{ - "group": { "default": "Other" } - }] -} -``` - -File: [src\webparts\pageContributors\PageContributorsWebPart.manifest.json:13:16](src\webparts\pageContributors\PageContributorsWebPart.manifest.json) - -### FN003002 config.json version | Required - -Update config.json version number - -```json -{ - "version": "2.0" -} -``` - -File: [./config/config.json:1:1](./config/config.json) - -### FN003003 config.json bundles | Required - -In config.json add the 'bundles' property - -```json -{ - "bundles": { - "page-contributors-web-part": { - "components": [ - { - "entrypoint": "./lib/webparts/pageContributors/PageContributorsWebPart.js", - "manifest": "./src/webparts/pageContributors/PageContributorsWebPart.manifest.json" - } - ] - } - } -} -``` - -File: [./config/config.json:1:1](./config/config.json) - -### FN003004 config.json entries | Required - -Remove the "entries" property in ./config/config.json - -```json -{ - "entries": [ - { - "entry": "./lib/webparts/pageContributors/PageContributorsWebPart.js", - "manifest": "./src/webparts/pageContributors/PageContributorsWebPart.manifest.json", - "outputPath": "./dist/page-contributors.bundle.js" - } - ] -} -``` - -File: [./config/config.json:2:3](./config/config.json) - -### FN003005 Update path of the localized resource | Required - -In the config.json file, update the path of the localized resource - -```json -{ - "localizedResources": { - "pageContributorsStrings": "lib/webparts/pageContributors/loc/{locale}.js" - } -} -``` - -File: [./config/config.json:11:5](./config/config.json) - -### FN011008 Client-side component manifest requiresCustomScript property | Required - -In the manifest rename the safeWithCustomScriptDisabled property to requiresCustomScript and invert its value - -```json -{ - "requiresCustomScript": true -} -``` - -File: [src\webparts\pageContributors\PageContributorsWebPart.manifest.json:9:3](src\webparts\pageContributors\PageContributorsWebPart.manifest.json) - -### FN017001 Run npm dedupe | Optional - -If, after upgrading npm packages, when building the project you have errors similar to: "error TS2345: Argument of type 'SPHttpClientConfiguration' is not assignable to parameter of type 'SPHttpClientConfiguration'", try running 'npm dedupe' to cleanup npm packages. - -Execute the following command: - -```sh -npm dedupe -``` - -File: [./package.json](./package.json) - -## Summary - -### Execute script - -```sh -npm un -S @types/react @types/react-dom @types/webpack-env @types/react-addons-shallow-compare @types/react-addons-update @types/react-addons-test-utils -npm un -D @types/chai @types/mocha -npm i -SE @microsoft/sp-core-library@1.12.1 @microsoft/sp-webpart-base@1.12.1 @microsoft/sp-property-pane@1.12.1 react@16.9.0 react-dom@16.9.0 office-ui-fabric-react@7.156.0 @types/es6-promise@0.0.33 -npm i -DE @microsoft/sp-build-web@1.12.1 @microsoft/sp-module-interfaces@1.12.1 @microsoft/sp-webpart-workbench@1.12.1 @microsoft/sp-tslint-rules@1.12.1 gulp@4.0.2 @microsoft/rush-stack-compiler-3.7@0.2.3 @types/react@16.9.36 @types/react-dom@16.9.8 @types/webpack-env@1.13.1 @types/es6-promise@0.0.33 tslint-microsoft-contrib@5.0.0 ajv@5.2.2 -npm dedupe -rm ".editorconfig" -mkdir "D:\project\sharing minds\source\Subscription Engine\External WebParts\Page Contributors\Source/teams" -cp "C:\Users\Ari\AppData\Roaming\nvm\v10.20.1\node_modules\@pnp\cli-microsoft365\dist\m365\spfx\commands\project\project-upgrade\assets\tab20x20.png" "D:\project\sharing minds\source\Subscription Engine\External WebParts\Page Contributors\Source\teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_outline.png" -cp "C:\Users\Ari\AppData\Roaming\nvm\v10.20.1\node_modules\@pnp\cli-microsoft365\dist\m365\spfx\commands\project\project-upgrade\assets\tab96x96.png" "D:\project\sharing minds\source\Subscription Engine\External WebParts\Page Contributors\Source\teams\dfb5229a-c1c3-4e98-870b-c40dd6e4ec4b_color.png" -rm "config\tslint.json" -cat > "src\index.ts" << EOF -// A file is required to be in the root of the /src directory by the TypeScript compiler - -EOF -``` - -### Modify files - -#### [./config/copy-assets.json](./config/copy-assets.json) - -Update copy-assets.json deployCdnPath: - -```json -{ - "deployCdnPath": "./release/assets/" -} -``` - -Update copy-assets.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/copy-assets.schema.json" -} -``` - -#### [./config/deploy-azure-storage.json](./config/deploy-azure-storage.json) - -Update deploy-azure-storage.json workingDir: - -```json -{ - "workingDir": "./release/assets/" -} -``` - -Update deploy-azure-storage.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/deploy-azure-storage.schema.json" -} -``` - -#### [./.yo-rc.json](./.yo-rc.json) - -Update version in .yo-rc.json: - -```json -{ - "@microsoft/generator-sharepoint": { - "version": "1.12.1" - } -} -``` - -Update isDomainIsolated in .yo-rc.json: - -```json -{ - "@microsoft/generator-sharepoint": { - "isDomainIsolated": false - } -} -``` - -Update isCreatingSolution in .yo-rc.json: - -```json -{ - "@microsoft/generator-sharepoint": { - "isCreatingSolution": true - } -} -``` - -Update packageManager in .yo-rc.json: - -```json -{ - "@microsoft/generator-sharepoint": { - "packageManager": "npm" - } -} -``` - -Update componentType in .yo-rc.json: - -```json -{ - "@microsoft/generator-sharepoint": { - "componentType": "webpart" - } -} -``` - -#### [./.gitignore](./.gitignore) - -To .gitignore add the 'release' folder: - -```text -release -``` - -#### [./tsconfig.json](./tsconfig.json) - -Update tsconfig.json extends property: - -```json -{ - "extends": "./node_modules/@microsoft/rush-stack-compiler-3.7/includes/tsconfig-web.json" -} -``` - -Add es2015.promise lib in tsconfig.json: - -```json -{ - "compilerOptions": { - "lib": [ - "es2015.promise" - ] - } -} -``` - -Remove es6-promise type in tsconfig.json: - -```json -{ - "compilerOptions": { - "types": [ - "es6-promise" - ] - } -} -``` - -Add to the tsconfig.json include property: - -```json -{ - "include": [ - "src/**/*.tsx" - ] -} -``` - -Update tsconfig.json inlineSources value: - -```json -{ - "compilerOptions": { - "inlineSources": false - } -} -``` - -Update tsconfig.json strictNullChecks value: - -```json -{ - "compilerOptions": { - "strictNullChecks": false - } -} -``` - -Update tsconfig.json noUnusedLocals value: - -```json -{ - "compilerOptions": { - "noUnusedLocals": false - } -} -``` - -Update tsconfig.json outDir value: - -```json -{ - "compilerOptions": { - "outDir": "lib" - } -} -``` - -Update tsconfig.json exclude property: - -```json -{ - "exclude": [ - "node_modules", - "lib" - ] -} -``` - -Update module type in tsconfig.json: - -```json -{ - "compilerOptions": { - "module": "esnext" - } -} -``` - -Update moduleResolution in tsconfig.json: - -```json -{ - "compilerOptions": { - "moduleResolution": "node" - } -} -``` - -Update skipLibCheck in tsconfig.json: - -```json -{ - "compilerOptions": { - "skipLibCheck": true - } -} -``` - -Add ./node_modules/@types to typeRoots in tsconfig.json: - -```json -{ - "compilerOptions": { - "typeRoots": [ - "./node_modules/@types" - ] - } -} -``` - -Add ./node_modules/@microsoft to typeRoots in tsconfig.json: - -```json -{ - "compilerOptions": { - "typeRoots": [ - "./node_modules/@microsoft" - ] - } -} -``` - -Remove es6-collections type in tsconfig.json: - -```json -{ - "compilerOptions": { - "types": [ - "es6-collections" - ] - } -} -``` - -Add es5 lib in tsconfig.json: - -```json -{ - "compilerOptions": { - "lib": [ - "es5" - ] - } -} -``` - -Add dom lib in tsconfig.json: - -```json -{ - "compilerOptions": { - "lib": [ - "dom" - ] - } -} -``` - -Add es2015.collection lib in tsconfig.json: - -```json -{ - "compilerOptions": { - "lib": [ - "es2015.collection" - ] - } -} -``` - -#### [./gulpfile.js](./gulpfile.js) - -Before 'build.initialize(require('gulp'));' add the serve task: - -```js -var getTasks = build.rig.getTasks; -build.rig.getTasks = function () { - var result = getTasks.call(build.rig); - - result.set('serve', result.get('serve-deprecated')); - - return result; -}; - -``` - -Add suppression for ms-Grid sass warning: - -```js -build.addSuppression(`Warning - [sass] The local CSS class 'ms-Grid' is not camelCase and will not be type-safe.`); -``` - -#### [./tslint.json](./tslint.json) - -Update tslint.json extends property: - -```json -{ - "extends": "./node_modules/@microsoft/sp-tslint-rules/base-tslint.json" -} -``` - -Remove rulesDirectory from tslint.json: - -```json -{ - "rulesDirectory": [] -} -``` - -#### [./package.json](./package.json) - -Remove package.json property: - -```json -{ - "engines": "undefined" -} -``` - -Add resolution for package @types/react: - -```json -{ - "resolutions": { - "@types/react": "16.8.8" - } -} -``` - -Add package.json property: - -```json -{ - "main": "lib/index.js" -} -``` - -#### [./config/package-solution.json](./config/package-solution.json) - -In package-solution.json add developer section: - -```json -{ - "solution": { - "developer": { - "name": "Contoso", - "privacyUrl": "https://contoso.com/privacy", - "termsOfUseUrl": "https://contoso.com/terms-of-use", - "websiteUrl": "https://contoso.com/my-app", - "mpnId": "000000" - } - } -} -``` - -Update package-solution.json isDomainIsolated: - -```json -{ - "solution": { - "isDomainIsolated": false - } -} -``` - -Update package-solution.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/package-solution.schema.json" -} -``` - -Update package-solution.json includeClientSideAssets: - -```json -{ - "solution": { - "includeClientSideAssets": true - } -} -``` - -#### [src\webparts\pageContributors\PageContributorsWebPart.ts](src\webparts\pageContributors\PageContributorsWebPart.ts) - -Refactor the code to import property pane property from the @microsoft/sp-property-pane npm package instead of the @microsoft/sp-webpart-base package: - -```ts -import { BaseClientSideWebPart } from "@microsoft/sp-webpart-base"; -import { IPropertyPaneConfiguration, PropertyPaneSlider, PropertyPaneDropdown, PropertyPaneTextField } from "@microsoft/sp-property-pane"; -``` - -#### [src\webparts\pageContributors\PageContributorsWebPart.manifest.json](src\webparts\pageContributors\PageContributorsWebPart.manifest.json) - -Update the supportedHosts property in the manifest: - -```json -{ - "supportedHosts": ["SharePointWebPart"] -} -``` - -Update schema in manifest: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx/client-side-web-part-manifest.schema.json" -} -``` - -In the manifest update the default group value: - -```json -{ - "preconfiguredEntries": [{ - "group": { "default": "Other" } - }] -} -``` - -In the manifest rename the safeWithCustomScriptDisabled property to requiresCustomScript and invert its value: - -```json -{ - "requiresCustomScript": true -} -``` - -#### [./config/config.json](./config/config.json) - -Update config.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/config.2.0.schema.json" -} -``` - -Update config.json version number: - -```json -{ - "version": "2.0" -} -``` - -In config.json add the 'bundles' property: - -```json -{ - "bundles": { - "page-contributors-web-part": { - "components": [ - { - "entrypoint": "./lib/webparts/pageContributors/PageContributorsWebPart.js", - "manifest": "./src/webparts/pageContributors/PageContributorsWebPart.manifest.json" - } - ] - } - } -} -``` - -Remove the "entries" property in ./config/config.json: - -```json -{ - "entries": [ - { - "entry": "./lib/webparts/pageContributors/PageContributorsWebPart.js", - "manifest": "./src/webparts/pageContributors/PageContributorsWebPart.manifest.json", - "outputPath": "./dist/page-contributors.bundle.js" - } - ] -} -``` - -In the config.json file, update the path of the localized resource: - -```json -{ - "localizedResources": { - "pageContributorsStrings": "lib/webparts/pageContributors/loc/{locale}.js" - } -} -``` - -#### [./config/serve.json](./config/serve.json) - -Update serve.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/core-build/serve.schema.json" -} -``` - -#### [./config/write-manifests.json](./config/write-manifests.json) - -Update write-manifests.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/write-manifests.schema.json" -} -``` - -#### [.vscode/extensions.json](.vscode/extensions.json) - -In the .vscode folder, add the extensions.json file: - -```json -{ - "recommendations": [ - "msjsdiag.debugger-for-chrome" - ] -} -``` - -#### [.vscode/launch.json](.vscode/launch.json) - -In the .vscode folder, add the launch.json file: - -```json -{ - /** - Install Chrome Debugger Extension for Visual Studio Code - to debug your components with the Chrome browser: - https://aka.ms/spfx-debugger-extensions - */ - "version": "0.2.0", - "configurations": [{ - "name": "Local workbench", - "type": "chrome", - "request": "launch", - "url": "https://localhost:4321/temp/workbench.html", - "webRoot": "${workspaceRoot}", - "sourceMaps": true, - "sourceMapPathOverrides": { - "webpack:///../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../../src/*": "${webRoot}/src/*" - }, - "runtimeArgs": [ - "--remote-debugging-port=9222" - ] - }, - { - "name": "Hosted workbench", - "type": "chrome", - "request": "launch", - "url": "https://enter-your-SharePoint-site/_layouts/workbench.aspx", - "webRoot": "${workspaceRoot}", - "sourceMaps": true, - "sourceMapPathOverrides": { - "webpack:///../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../src/*": "${webRoot}/src/*", - "webpack:///../../../../../src/*": "${webRoot}/src/*" - }, - "runtimeArgs": [ - "--remote-debugging-port=9222", - "-incognito" - ] - } - ] -} -```