pnp / sp-dev-fx-webparts

SharePoint Framework web part, Teams tab, personal app, app page samples
http://aka.ms/spfx-webparts
MIT License
2.04k stars 3.86k forks source link

react-azure-openai-api-stream Production and Local Errors #5305

Open gspgit00 opened 5 days ago

gspgit00 commented 5 days ago

Disclaimer

Yes

Sample

https://github.com/pnp/sp-dev-fx-webparts/tree/main/samples/react-azure-openai-api-stream

Contributor(s)

Luis Manez and Chris Kent

What happened?

Loading in workbench is successful and works as designed. Loading in local or production shows the "Something went wrong..." error with additional information in the console.

Could not load chat-streaming-web-part in require. TypeError: Cannot read properties of undefined (reading 'id') at sp-pages-assembly_en…380f4c.js:206:11116 at new Promise () at e.loadComponent (sp-pages-assembly_en…380f4c.js:206:11084) at sp-pages-assembly_en…380f4c.js:206:13292 at async Promise.all (/sites/HR/SitePages/index 0)

Steps to reproduce

  1. Clone the repo
  2. Clean
  3. Build
  4. Bundle and Package (local or production)

Expected behavior

I expected to see the web part behave as it does in workbench, but I'm receiving errors.

Target SharePoint environment

SharePoint Online

Developer environment

Windows

Browsers

What version of Node.js is currently installed on your workstation?

18.20.4

What version of Node.js is required by the sample?

I built at 18.20.4 first, rebuilt with 16.20.2 (incompatible), rebuilt with 18.20.4

Paste the results of SPFx doctor

Verifying configuration of your system for working with the SharePoint Framework

√ SharePoint Framework v1.18.2 √ Node v18.20.4 √ yo v5.0.0 √ gulp-cli v2.3.0 √ bundled typescript used

Additional environment details

No response

gspgit00 commented 5 days ago

Adding additional info:

"dependencies": { "@fluentui/react": "^8.106.4", "@microsoft/fetch-event-source": "2.0.1", "@microsoft/mgt-react": "3.0.1", "@microsoft/mgt-spfx": "3.1.3", "@microsoft/sp-component-base": "1.18.2", "@microsoft/sp-core-library": "1.18.2", "@microsoft/sp-lodash-subset": "1.18.2", "@microsoft/sp-office-ui-fabric-core": "1.18.2", "@microsoft/sp-property-pane": "1.18.2", "@microsoft/sp-webpart-base": "1.18.2", "@pnp/cli-microsoft365": "^9.1.0", "@pnp/spfx-property-controls": "3.15.1", "react": "17.0.1", "react-dom": "17.0.1", "react-remark": "^2.1.0", "remark-gfm": "1.0.0", "tslib": "2.3.1" },

NishkalankBezawada commented 13 hours ago

Hello @gspgit00

Did you try out with node v16.18.1? The .nvmrc file says it :)

Thanks, Nishkalank

gspgit00 commented 6 hours ago

Hi @NishkalankBezawada.

I did a fresh clone and installed with 16.18.1 and received the same "Unsupported engine" errors. It's requesting a more recent node package.

npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@azure/core-rest-pipeline@1.13.0', npm WARN EBADENGINE required: { node: '>=18.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/eslint-config-spfx@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-adaptive-card-extension-base@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-build-core-tasks@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-build-web@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-component-base@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-core-library@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-diagnostics@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-dynamic-data@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-http@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-image-helper@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-loader@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-lodash-subset@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-module-interfaces@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-odata-types@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-office-ui-fabric-core@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-page-context@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-property-pane@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE } npm WARN EBADENGINE Unsupported engine { npm WARN EBADENGINE package: '@microsoft/sp-webpart-base@1.18.2', npm WARN EBADENGINE required: { node: '>=18.17.1 <19.0.0' }, npm WARN EBADENGINE current: { node: 'v16.18.1', npm: '8.19.2' } npm WARN EBADENGINE }

I also received the original error when packaging for local.

ervingayle commented 3 hours ago

The '@azure/core-rest-pipeline@1.13.0' package seems to require node v18 since October 2023 in this commit. Perhaps the nvmrc file was just not updated when this sample was published. I see SPFx 1.18.0 is supposed to support Node 16 and 18 however since you didn't get these dependency errors in Node 18, I would say that is the better setup. Did you try to deploy the web-part as a test and see if it works or are you only testing from the workbench?

gspgit00 commented 1 hour ago

Yes, I deployed as both local and production using 18.20.4. Workbench works great, but production is where I receive "Cannot ready properties of..." error.