Added nvmrc, updated sample.json
This commit is contained in:
parent
ea554c8843
commit
48db6ab923
|
@ -0,0 +1 @@
|
|||
v16.13.0
|
|
@ -32,7 +32,7 @@ This web part demonstrates building a React functional component that uses data
|
|||
|
||||
## Contributors
|
||||
|
||||
* Bill Ayers
|
||||
* [Bill Ayers (SPDoctor)](https://github.com/SPDoctor)
|
||||
* [Don Kirkham](https://github.com/DonKirkham)
|
||||
|
||||
## Version history
|
||||
|
@ -72,7 +72,7 @@ This is an extension of the approach used in the [React-Functional-Component](ht
|
|||
|
||||
## TeamsTrackerWebPart.ts Initialise PnPJS
|
||||
|
||||
The onInit method of BaseClientSideWebPart is overriden to initialise the PnPJS graph object. The web part is then able to get access to the Microsoft Graph using the PnPJS library. The User.Read.All permission is implicitly provided.
|
||||
The onInit method of BaseClientSideWebPart is overridden to initialise the PnPJS graph object. The web part is then able to get access to the Microsoft Graph using the PnPJS library. The User.Read.All permission is implicitly provided.
|
||||
|
||||
## Functional Component with state
|
||||
|
||||
|
@ -82,7 +82,7 @@ The TeamsTracker.tsx React Component is a React functional component. This simpl
|
|||
const initialTeamsList: MSGraph.Group[] = null;
|
||||
const [teamsList, setTeamsList] = React.useState(initialTeamsList);
|
||||
```
|
||||
React.useState takes an initial value for the state variable, which we initialise to *null* but by means of a strongly typed const. This means that we will get type checking and intellisense for the state object. React.useState returns an array of two objects. The first is a variable containing the state value, and the second is a setter function for the value, and the convention is to use the array destructuring operator to unpack them into local constants. Whenever we need to use the current value of the teamsList we just use it as a normal variable, and wherever we need to change the value we call *setTeamsList(newValue)*.
|
||||
React.useState takes an initial value for the state variable, which we initialize to *null* but by means of a strongly typed const. This means that we will get type checking and intellisense for the state object. React.useState returns an array of two objects. The first is a variable containing the state value, and the second is a setter function for the value, and the convention is to use the array destructuring operator to unpack them into local constants. Whenever we need to use the current value of the teamsList we just use it as a normal variable, and wherever we need to change the value we call *setTeamsList(newValue)*.
|
||||
|
||||
## Fetching Data
|
||||
|
||||
|
@ -117,7 +117,7 @@ The `Teams.tsx` component is only responsible for rendering an individual team,
|
|||
```
|
||||
export default function Team({ channelID, displayName, showChannels }) {
|
||||
```
|
||||
Again we use state to manage a list of channels and initialise it to an empty array. But in this case we have a property *showChannels* that is the flag set by the user in the property pane. If this is enabled we retrieve the channels from the Microsoft Graph using the PnPJS library, and if not we set it to an empty array. We need to explicitly reset the array in case the user enables and then subsequently disables the *showChannels* option. Finally, notice that we now need to include a dependency for the second argument of *useEffect* so that the framework knows to call the method again if the value of showChannels changes.
|
||||
Again we use state to manage a list of channels and initialize it to an empty array. But in this case we have a property *showChannels* that is the flag set by the user in the property pane. If this is enabled we retrieve the channels from the Microsoft Graph using the PnPJS library, and if not we set it to an empty array. We need to explicitly reset the array in case the user enables and then subsequently disables the *showChannels* option. Finally, notice that we now need to include a dependency for the second argument of *useEffect* so that the framework knows to call the method again if the value of showChannels changes.
|
||||
|
||||
```
|
||||
const [channelsList, setChannelsList] = React.useState([]);
|
||||
|
|
|
@ -9,7 +9,7 @@
|
|||
"This web part demonstrates building a React functional component that uses data from a remote service, in this case the Microsoft Graph, using the recently introduced React Hooks feature. The example web part renders a list of the user\u0027s Teams and, optionally, the channels in each Team."
|
||||
],
|
||||
"creationDateTime": "2019-06-14",
|
||||
"updateDateTime": "2022-02-21",
|
||||
"updateDateTime": "2023-10-10",
|
||||
"products": [
|
||||
"SharePoint"
|
||||
],
|
||||
|
@ -20,7 +20,7 @@
|
|||
},
|
||||
{
|
||||
"key": "SPFX-VERSION",
|
||||
"value": "1.14.0"
|
||||
"value": "1.18.0"
|
||||
}
|
||||
],
|
||||
"thumbnails": [
|
||||
|
@ -34,7 +34,6 @@
|
|||
"authors": [
|
||||
{
|
||||
"gitHubAccount": "SPDoctor",
|
||||
"company": "Flow Simulation Ltd.",
|
||||
"pictureUrl": "https://avatars.githubusercontent.com/u/10207194?s=460\u0026v=4",
|
||||
"name": "Bill Ayers",
|
||||
"twitter": "SPDoctor"
|
||||
|
|
|
@ -1,649 +0,0 @@
|
|||
# Upgrade project react-functional-component-with-data-fetch to v1.18.0
|
||||
|
||||
Date: 10/15/2023
|
||||
|
||||
## Findings
|
||||
|
||||
Following is the list of steps required to upgrade your project to SharePoint Framework version 1.18.0. [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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:13: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:14: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:15: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:17: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:16:5](./package.json)
|
||||
|
||||
### FN001022 office-ui-fabric-react | Required
|
||||
|
||||
Remove SharePoint Framework dependency package office-ui-fabric-react
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm un -S office-ui-fabric-react
|
||||
```
|
||||
|
||||
File: [./package.json:22:5](./package.json)
|
||||
|
||||
### FN001035 @fluentui/react | Required
|
||||
|
||||
Install SharePoint Framework dependency package @fluentui/react
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -SE @fluentui/react@8.106.4
|
||||
```
|
||||
|
||||
File: [./package.json:12:3](./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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:12: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:32: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:29: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.18.0
|
||||
```
|
||||
|
||||
File: [./package.json:29:3](./package.json)
|
||||
|
||||
### FN002026 typescript | Required
|
||||
|
||||
Upgrade SharePoint Framework dev dependency package typescript
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -DE typescript@4.7.4
|
||||
```
|
||||
|
||||
File: [./package.json:40:5](./package.json)
|
||||
|
||||
### FN002028 @microsoft/rush-stack-compiler-4.7 | Required
|
||||
|
||||
Install SharePoint Framework dev dependency package @microsoft/rush-stack-compiler-4.7
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -DE @microsoft/rush-stack-compiler-4.7@0.1.0
|
||||
```
|
||||
|
||||
File: [./package.json:29:3](./package.json)
|
||||
|
||||
### FN010001 .yo-rc.json version | Recommended
|
||||
|
||||
Update version in .yo-rc.json
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"version": "1.18.0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
File: [./.yo-rc.json:3:5](./.yo-rc.json)
|
||||
|
||||
### FN010010 .yo-rc.json @microsoft/teams-js SDK version | Recommended
|
||||
|
||||
Update @microsoft/teams-js SDK version in .yo-rc.json
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"sdkVersions": {
|
||||
"@microsoft/teams-js": "2.12.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
File: [./.yo-rc.json:2:3](./.yo-rc.json)
|
||||
|
||||
### FN012017 tsconfig.json extends property | Required
|
||||
|
||||
Update tsconfig.json extends property
|
||||
|
||||
```json
|
||||
{
|
||||
"extends": "./node_modules/@microsoft/rush-stack-compiler-4.7/includes/tsconfig-web.json"
|
||||
}
|
||||
```
|
||||
|
||||
File: [./tsconfig.json:2:3](./tsconfig.json)
|
||||
|
||||
### FN021003 package.json engines.node | Required
|
||||
|
||||
Update package.json engines.node property
|
||||
|
||||
```json
|
||||
{
|
||||
"engines": {
|
||||
"node": ">=16.13.0 <17.0.0 || >=18.17.1 <19.0.0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
File: [./package.json:5:14](./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:29:3](./package.json)
|
||||
|
||||
### FN007002 serve.json initialPage | Required
|
||||
|
||||
Update serve.json initialPage URL
|
||||
|
||||
```json
|
||||
{
|
||||
"initialPage": "https://{tenantDomain}/_layouts/workbench.aspx"
|
||||
}
|
||||
```
|
||||
|
||||
File: [./config/serve.json:5:3](./config/serve.json)
|
||||
|
||||
### FN015009 config/sass.json | Required
|
||||
|
||||
Add file config/sass.json
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
cat > "config/sass.json" << EOF
|
||||
{
|
||||
"$schema": "https://developer.microsoft.com/json-schemas/core-build/sass.schema.json"
|
||||
}
|
||||
EOF
|
||||
```
|
||||
|
||||
File: [config/sass.json](config/sass.json)
|
||||
|
||||
### FN001008 react | Required
|
||||
|
||||
Upgrade SharePoint Framework dependency package react
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -SE react@17.0.1
|
||||
```
|
||||
|
||||
File: [./package.json:23:5](./package.json)
|
||||
|
||||
### FN001009 react-dom | Required
|
||||
|
||||
Upgrade SharePoint Framework dependency package react-dom
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -SE react-dom@17.0.1
|
||||
```
|
||||
|
||||
File: [./package.json:24:5](./package.json)
|
||||
|
||||
### FN002015 @types/react | Required
|
||||
|
||||
Upgrade SharePoint Framework dev dependency package @types/react
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -DE @types/react@17.0.45
|
||||
```
|
||||
|
||||
File: [./package.json:35:5](./package.json)
|
||||
|
||||
### FN002016 @types/react-dom | Required
|
||||
|
||||
Upgrade SharePoint Framework dev dependency package @types/react-dom
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -DE @types/react-dom@17.0.17
|
||||
```
|
||||
|
||||
File: [./package.json:36:5](./package.json)
|
||||
|
||||
### FN010008 .yo-rc.json nodeVersion | Recommended
|
||||
|
||||
Update nodeVersion in .yo-rc.json
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"nodeVersion": "18.18.0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
File: [./.yo-rc.json:2:38](./.yo-rc.json)
|
||||
|
||||
### FN010009 .yo-rc.json @microsoft/microsoft-graph-client SDK version | Recommended
|
||||
|
||||
Update @microsoft/microsoft-graph-client SDK version in .yo-rc.json
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"sdkVersions": {
|
||||
"@microsoft/microsoft-graph-client": "3.0.2"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
File: [./.yo-rc.json:2:3](./.yo-rc.json)
|
||||
|
||||
### FN022001 Scss file import | Required
|
||||
|
||||
Remove scss file import
|
||||
|
||||
```scss
|
||||
@import '~office-ui-fabric-react/dist/sass/References.scss'
|
||||
```
|
||||
|
||||
File: [src/webparts/teamsTracker/components/TeamsTracker.module.scss](src/webparts/teamsTracker/components/TeamsTracker.module.scss)
|
||||
|
||||
### FN022002 Scss file import | Optional
|
||||
|
||||
Add scss file import
|
||||
|
||||
```scss
|
||||
@import '~@fluentui/react/dist/sass/References.scss'
|
||||
```
|
||||
|
||||
File: [src/webparts/teamsTracker/components/TeamsTracker.module.scss](src/webparts/teamsTracker/components/TeamsTracker.module.scss)
|
||||
|
||||
### 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)
|
||||
|
||||
### FN001033 tslib | Required
|
||||
|
||||
Install SharePoint Framework dependency package tslib
|
||||
|
||||
Execute the following command:
|
||||
|
||||
```sh
|
||||
npm i -SE tslib@2.3.1
|
||||
```
|
||||
|
||||
File: [./package.json:12: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:38: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:33: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:37:5](./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:29: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:29:3](./package.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');
|
||||
export default {
|
||||
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 -S office-ui-fabric-react
|
||||
npm un -D @microsoft/sp-tslint-rules
|
||||
npm i -SE @microsoft/sp-core-library@1.18.0 @microsoft/sp-lodash-subset@1.18.0 @microsoft/sp-office-ui-fabric-core@1.18.0 @microsoft/sp-webpart-base@1.18.0 @microsoft/sp-property-pane@1.18.0 @fluentui/react@8.106.4 @microsoft/sp-adaptive-card-extension-base@1.18.0 react@17.0.1 react-dom@17.0.1 tslib@2.3.1
|
||||
npm i -DE @microsoft/sp-module-interfaces@1.18.0 @microsoft/eslint-plugin-spfx@1.18.0 @microsoft/eslint-config-spfx@1.18.0 typescript@4.7.4 @microsoft/rush-stack-compiler-4.7@0.1.0 eslint@8.7.0 @types/react@17.0.45 @types/react-dom@17.0.17 ajv@6.12.5 @types/webpack-env@1.15.2 @rushstack/eslint-config@2.5.1 eslint-plugin-react-hooks@4.3.0
|
||||
npm dedupe
|
||||
cat > "config/sass.json" << EOF
|
||||
{
|
||||
"$schema": "https://developer.microsoft.com/json-schemas/core-build/sass.schema.json"
|
||||
}
|
||||
EOF
|
||||
rm "tslint.json"
|
||||
cat > ".eslintrc.js" << EOF
|
||||
require('@rushstack/eslint-config/patch/modern-module-resolution');
|
||||
export default {
|
||||
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.18.0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Update @microsoft/teams-js SDK version in .yo-rc.json:
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"sdkVersions": {
|
||||
"@microsoft/teams-js": "2.12.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Update nodeVersion in .yo-rc.json:
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"nodeVersion": "18.18.0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
Update @microsoft/microsoft-graph-client SDK version in .yo-rc.json:
|
||||
|
||||
```json
|
||||
{
|
||||
"@microsoft/generator-sharepoint": {
|
||||
"sdkVersions": {
|
||||
"@microsoft/microsoft-graph-client": "3.0.2"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### [./tsconfig.json](./tsconfig.json)
|
||||
|
||||
Update tsconfig.json extends property:
|
||||
|
||||
```json
|
||||
{
|
||||
"extends": "./node_modules/@microsoft/rush-stack-compiler-4.7/includes/tsconfig-web.json"
|
||||
}
|
||||
```
|
||||
|
||||
Add noImplicitAny in tsconfig.json:
|
||||
|
||||
```json
|
||||
{
|
||||
"compilerOptions": {
|
||||
"noImplicitAny": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### [./package.json](./package.json)
|
||||
|
||||
Update package.json engines.node property:
|
||||
|
||||
```json
|
||||
{
|
||||
"engines": {
|
||||
"node": ">=16.13.0 <17.0.0 || >=18.17.1 <19.0.0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
#### [./config/serve.json](./config/serve.json)
|
||||
|
||||
Update serve.json initialPage URL:
|
||||
|
||||
```json
|
||||
{
|
||||
"initialPage": "https://{tenantDomain}/_layouts/workbench.aspx"
|
||||
}
|
||||
```
|
||||
|
||||
Update serve.json schema URL:
|
||||
|
||||
```json
|
||||
{
|
||||
"$schema": "https://developer.microsoft.com/json-schemas/spfx-build/spfx-serve.schema.json"
|
||||
}
|
||||
```
|
||||
|
||||
#### [src/webparts/teamsTracker/components/TeamsTracker.module.scss](src/webparts/teamsTracker/components/TeamsTracker.module.scss)
|
||||
|
||||
Remove scss file import:
|
||||
|
||||
```scss
|
||||
@import '~office-ui-fabric-react/dist/sass/References.scss'
|
||||
```
|
||||
|
||||
Add scss file import:
|
||||
|
||||
```scss
|
||||
@import '~@fluentui/react/dist/sass/References.scss'
|
||||
```
|
||||
|
||||
#### [./.gitignore](./.gitignore)
|
||||
|
||||
To .gitignore add the '.heft' folder:
|
||||
|
||||
```text
|
||||
.heft
|
||||
```
|
Loading…
Reference in New Issue