From f1000add824c57ce93c6df94416ea589bad838a3 Mon Sep 17 00:00:00 2001 From: Dan Toft Date: Wed, 9 Oct 2024 20:49:22 +0200 Subject: [PATCH 1/2] Fixed versioning error in package-solution.json As mentioned in #5280 --- samples/react-add-js-css-ref/config/package-solution.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/samples/react-add-js-css-ref/config/package-solution.json b/samples/react-add-js-css-ref/config/package-solution.json index f60457d120..d1bb4eb12a 100644 --- a/samples/react-add-js-css-ref/config/package-solution.json +++ b/samples/react-add-js-css-ref/config/package-solution.json @@ -3,7 +3,7 @@ "solution": { "name": "react-add-js-css-ref-client-side-solution", "id": "d9c30e1a-bf06-46fa-807d-ce5182d9c91c", - "version": "2.1.0", + "version": "2.1.0.0", "includeClientSideAssets": true, "isDomainIsolated": false, "developer": { From de643b9e92b3ce358ed8b2311f53cb7278cd2624 Mon Sep 17 00:00:00 2001 From: Hugo Bernier Date: Sat, 12 Oct 2024 21:16:57 -0400 Subject: [PATCH 2/2] Updated sample.json nvmrc --- samples/react-add-js-css-ref/.nvmrc | 1 + samples/react-add-js-css-ref/README.md | 16 +- .../react-add-js-css-ref/assets/sample.json | 2 +- samples/react-add-js-css-ref/upgrade.md | 443 ------------------ 4 files changed, 3 insertions(+), 459 deletions(-) create mode 100644 samples/react-add-js-css-ref/.nvmrc delete mode 100644 samples/react-add-js-css-ref/upgrade.md diff --git a/samples/react-add-js-css-ref/.nvmrc b/samples/react-add-js-css-ref/.nvmrc new file mode 100644 index 0000000000..2ab3d4be55 --- /dev/null +++ b/samples/react-add-js-css-ref/.nvmrc @@ -0,0 +1 @@ +v16.20.2 diff --git a/samples/react-add-js-css-ref/README.md b/samples/react-add-js-css-ref/README.md index 2b53dfafcd..1e607fd70d 100644 --- a/samples/react-add-js-css-ref/README.md +++ b/samples/react-add-js-css-ref/README.md @@ -1,18 +1,3 @@ ---- -page_type: sample -products: -- office-sp -languages: -- javascript -- typescript -extensions: - contentType: samples - technologies: - - SharePoint Framework - platforms: - - react - createdDate: 04/24/2020 12:00:00 AM ---- # Add JS and CSS reference on Modern Pages via SPFx application customizer extension This repo is a react based SPFx web part and extension that allows users to add/modify/delete custom js and css file references using SPFx application customizer extension all modern pages within SP online site. This web part provides an interface to JS and CSS file references so that we don't have to modify code when we need to change references or add new references in the future. As part of security measures, this actions on web part can be only accessed by users who have Manage web permission on site. @@ -22,6 +7,7 @@ Web Part in Action ![Web part in action](assets/webpartinaction.gif?raw=true "web part in action") Challenges/Drawback with ONLY using SPFx extension for adding js and css file references. + * JS and CSS file references links needs to be hardcoded in solution * Changes to code required if we need to change add new reference or remove existing reference. * Redeployment of package and installation diff --git a/samples/react-add-js-css-ref/assets/sample.json b/samples/react-add-js-css-ref/assets/sample.json index 1cfa353a17..db88e81b62 100644 --- a/samples/react-add-js-css-ref/assets/sample.json +++ b/samples/react-add-js-css-ref/assets/sample.json @@ -9,7 +9,7 @@ "React-based SPFx web part and extension that allows users to add/modify/delete custom js and css file references using SPFx application customizer extension all modern pages within SP online site." ], "creationDateTime": "2020-06-11", - "updateDateTime": "2022-10-24", + "updateDateTime": "2024-10-09", "products": [ "SharePoint" ], diff --git a/samples/react-add-js-css-ref/upgrade.md b/samples/react-add-js-css-ref/upgrade.md deleted file mode 100644 index 4fb87a5254..0000000000 --- a/samples/react-add-js-css-ref/upgrade.md +++ /dev/null @@ -1,443 +0,0 @@ -# Upgrade project react-add-js-css-ref to v1.15.2 - -Date: 10/20/2022 - -## Findings - -Following is the list of steps required to upgrade your project to SharePoint Framework version 1.15.2. [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.15.2 -``` - -File: [./package.json:14:5](./package.json) - -### FN001021 @microsoft/sp-property-pane | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-property-pane - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-property-pane@1.15.2 -``` - -File: [./package.json:18: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.15.2 -``` - -File: [./package.json:19:5](./package.json) - -### FN001002 @microsoft/sp-lodash-subset | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-lodash-subset - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-lodash-subset@1.15.2 -``` - -File: [./package.json:16:5](./package.json) - -### FN001003 @microsoft/sp-office-ui-fabric-core | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-office-ui-fabric-core - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-office-ui-fabric-core@1.15.2 -``` - -File: [./package.json:17:5](./package.json) - -### FN001034 @microsoft/sp-adaptive-card-extension-base | Optional - -Install SharePoint Framework dependency package @microsoft/sp-adaptive-card-extension-base - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-adaptive-card-extension-base@1.15.2 -``` - -File: [./package.json:11:3](./package.json) - -### FN001013 @microsoft/decorators | Required - -Upgrade SharePoint Framework dependency package @microsoft/decorators - -Execute the following command: - -```sh -npm i -SE @microsoft/decorators@1.15.2 -``` - -File: [./package.json:12:5](./package.json) - -### FN001011 @microsoft/sp-dialog | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-dialog - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-dialog@1.15.2 -``` - -File: [./package.json:15:5](./package.json) - -### FN001012 @microsoft/sp-application-base | Required - -Upgrade SharePoint Framework dependency package @microsoft/sp-application-base - -Execute the following command: - -```sh -npm i -SE @microsoft/sp-application-base@1.15.2 -``` - -File: [./package.json:13:5](./package.json) - -### FN002022 @microsoft/eslint-plugin-spfx | Required - -Install SharePoint Framework dev dependency package @microsoft/eslint-plugin-spfx - -Execute the following command: - -```sh -npm i -DE @microsoft/eslint-plugin-spfx@1.15.2 -``` - -File: [./package.json:26:3](./package.json) - -### FN002023 @microsoft/eslint-config-spfx | Required - -Install SharePoint Framework dev dependency package @microsoft/eslint-config-spfx - -Execute the following command: - -```sh -npm i -DE @microsoft/eslint-config-spfx@1.15.2 -``` - -File: [./package.json:26:3](./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.15.2 -``` - -File: [./package.json:30:5](./package.json) - -### FN002026 typescript | Required - -Install SharePoint Framework dev dependency package typescript - -Execute the following command: - -```sh -npm i -DE typescript@4.5.5 -``` - -File: [./package.json:26:3](./package.json) - -### FN010001 .yo-rc.json version | Recommended - -Update version in .yo-rc.json - -```json -{ - "@microsoft/generator-sharepoint": { - "version": "1.15.2" - } -} -``` - -File: [./.yo-rc.json:5:5](./.yo-rc.json) - -### FN012020 tsconfig.json noImplicitAny | Required - -Add noImplicitAny in tsconfig.json - -```json -{ - "compilerOptions": { - "noImplicitAny": true - } -} -``` - -File: [./tsconfig.json:3:22](./tsconfig.json) - -### FN007001 serve.json schema | Required - -Update serve.json schema URL - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/spfx-serve.schema.json" -} -``` - -File: [./config/serve.json:2:3](./config/serve.json) - -### FN001022 office-ui-fabric-react | Required - -Upgrade SharePoint Framework dependency package office-ui-fabric-react - -Execute the following command: - -```sh -npm i -SE office-ui-fabric-react@7.185.7 -``` - -File: [./package.json:22:5](./package.json) - -### FN001033 tslib | Required - -Install SharePoint Framework dependency package tslib - -Execute the following command: - -```sh -npm i -SE tslib@2.3.1 -``` - -File: [./package.json:11:3](./package.json) - -### FN002007 ajv | Required - -Upgrade SharePoint Framework dev dependency package ajv - -Execute the following command: - -```sh -npm i -DE ajv@6.12.5 -``` - -File: [./package.json:36:5](./package.json) - -### FN002009 @microsoft/sp-tslint-rules | Required - -Remove SharePoint Framework dev dependency package @microsoft/sp-tslint-rules - -Execute the following command: - -```sh -npm un -D @microsoft/sp-tslint-rules -``` - -File: [./package.json:31:5](./package.json) - -### FN002013 @types/webpack-env | Required - -Upgrade SharePoint Framework dev dependency package @types/webpack-env - -Execute the following command: - -```sh -npm i -DE @types/webpack-env@1.15.2 -``` - -File: [./package.json:35:5](./package.json) - -### FN002020 @microsoft/rush-stack-compiler-4.5 | Required - -Install SharePoint Framework dev dependency package @microsoft/rush-stack-compiler-4.5 - -Execute the following command: - -```sh -npm i -DE @microsoft/rush-stack-compiler-4.5@0.2.2 -``` - -File: [./package.json:26:3](./package.json) - -### FN002021 @rushstack/eslint-config | Required - -Install SharePoint Framework dev dependency package @rushstack/eslint-config - -Execute the following command: - -```sh -npm i -DE @rushstack/eslint-config@2.5.1 -``` - -File: [./package.json:26:3](./package.json) - -### FN002024 eslint | Required - -Install SharePoint Framework dev dependency package eslint - -Execute the following command: - -```sh -npm i -DE eslint@8.7.0 -``` - -File: [./package.json:26:3](./package.json) - -### FN002025 eslint-plugin-react-hooks | Required - -Install SharePoint Framework dev dependency package eslint-plugin-react-hooks - -Execute the following command: - -```sh -npm i -DE eslint-plugin-react-hooks@4.3.0 -``` - -File: [./package.json:26:3](./package.json) - -### FN012017 tsconfig.json extends property | Required - -Update tsconfig.json extends property - -```json -{ - "extends": "./node_modules/@microsoft/rush-stack-compiler-4.5/includes/tsconfig-web.json" -} -``` - -File: [./tsconfig.json:2:3](./tsconfig.json) - -### FN015003 tslint.json | Required - -Remove file tslint.json - -Execute the following command: - -```sh -rm "tslint.json" -``` - -File: [tslint.json](tslint.json) - -### FN015008 .eslintrc.js | Required - -Add file .eslintrc.js - -Execute the following command: - -```sh -cat > ".eslintrc.js" << EOF -require('@rushstack/eslint-config/patch/modern-module-resolution'); -module.exports = { - extends: ['@microsoft/eslint-config-spfx/lib/profiles/react'], - parserOptions: { tsconfigRootDir: __dirname } -}; -EOF -``` - -File: [.eslintrc.js](.eslintrc.js) - -### FN023002 .gitignore '.heft' folder | Required - -To .gitignore add the '.heft' folder - - -File: [./.gitignore](./.gitignore) - -### 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 -D @microsoft/sp-tslint-rules -npm i -SE @microsoft/sp-core-library@1.15.2 @microsoft/sp-property-pane@1.15.2 @microsoft/sp-webpart-base@1.15.2 @microsoft/sp-lodash-subset@1.15.2 @microsoft/sp-office-ui-fabric-core@1.15.2 @microsoft/sp-adaptive-card-extension-base@1.15.2 @microsoft/decorators@1.15.2 @microsoft/sp-dialog@1.15.2 @microsoft/sp-application-base@1.15.2 office-ui-fabric-react@7.185.7 tslib@2.3.1 -npm i -DE @microsoft/eslint-plugin-spfx@1.15.2 @microsoft/eslint-config-spfx@1.15.2 @microsoft/sp-module-interfaces@1.15.2 typescript@4.5.5 ajv@6.12.5 @types/webpack-env@1.15.2 @microsoft/rush-stack-compiler-4.5@0.2.2 @rushstack/eslint-config@2.5.1 eslint@8.7.0 eslint-plugin-react-hooks@4.3.0 -npm dedupe -rm "tslint.json" -cat > ".eslintrc.js" << EOF -require('@rushstack/eslint-config/patch/modern-module-resolution'); -module.exports = { - extends: ['@microsoft/eslint-config-spfx/lib/profiles/react'], - parserOptions: { tsconfigRootDir: __dirname } -}; -EOF -``` - -### Modify files - -#### [./.yo-rc.json](./.yo-rc.json) - -Update version in .yo-rc.json: - -```json -{ - "@microsoft/generator-sharepoint": { - "version": "1.15.2" - } -} -``` - -#### [./tsconfig.json](./tsconfig.json) - -Add noImplicitAny in tsconfig.json: - -```json -{ - "compilerOptions": { - "noImplicitAny": true - } -} -``` - -Update tsconfig.json extends property: - -```json -{ - "extends": "./node_modules/@microsoft/rush-stack-compiler-4.5/includes/tsconfig-web.json" -} -``` - -#### [./config/serve.json](./config/serve.json) - -Update serve.json schema URL: - -```json -{ - "$schema": "https://developer.microsoft.com/json-schemas/spfx-build/spfx-serve.schema.json" -} -``` - -#### [./.gitignore](./.gitignore) - -To .gitignore add the '.heft' folder: - -```text -.heft -```