TypeError: Cannot read properties of undefined (reading 'id') when loading Spfx web part in Sharepoint

Question

I have created the hello world SPFx example and was able to get it running on our Sharepoint site (as local application).
Thereafter I have added new TS class which should open Power Bi reports. When I integrate this new class in the basic hello world example and republish so I can add the web part I get this error in the browser console:
Could not load hello-world-web-part in require. TypeError: Cannot read properties of undefined (reading 'id')

at sp-webpart-workbench-assembly_en-us_9573ea1b98f3fc5d64d6d39613e9037c.js:204:11180

at new Promise (<anonymous>)

at e.loadComponent (sp-webpart-workbench-assembly_en-us_9573ea1b98f3fc5d64d6d39613e9037c.js:204:11148)

at sp-webpart-workbench-assembly_en-us_9573ea1b98f3fc5d64d6d39613e9037c.js:204:13356

at async Promise.all (index 1)

I understand that this could be a dependency question.

These are my dependencies from package.json:

 "dependencies": {
    "@fluentui/react": "^8.123.0",
    "@microsoft/sp-component-base": "1.21.1",
    "@microsoft/sp-core-library": "1.21.1",
    "@microsoft/sp-lodash-subset": "1.21.1",
    "@microsoft/sp-office-ui-fabric-core": "1.21.1",
    "@microsoft/sp-property-pane": "1.21.1",
    "@microsoft/sp-webpart-base": "1.21.1",
    "m365": "^1.0.7",
    "powerbi-client": "^2.23.1",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    "tslib": "2.3.1"
  },
  "devDependencies": {
    "@microsoft/eslint-config-spfx": "1.21.1",
    "@microsoft/eslint-plugin-spfx": "1.21.1",
    "@microsoft/rush-stack-compiler-5.3": "0.1.0",
    "@microsoft/sp-build-web": "1.21.1",
    "@microsoft/sp-module-interfaces": "1.21.1",
    "@rushstack/eslint-config": "4.0.1",
    "@types/webpack-env": "~1.15.2",
    "ajv": "^6.12.5",
    "eslint": "8.57.1",
    "gulp": "4.0.2",
    "typescript": "~5.3.3"
  }

I also used the m365 cli tool but there it says this is in order for SPFx 1.21.1
Node is 22.14.0

We are using a normal MS hosted O365 environment. I tried to add the web part on a normal sharepoint site. Let me know if you need more details.

What am I missing?

Answer 1

Hi Romann, Christoph

Thank you for reaching out to the Microsoft Q&A community and sharing your concern. We completely understand the challenges you're facing. 

However, we’d like to clarify that this forum may not be the most appropriate place to address issues that are specific to SharePoint Framework (SPFx) development. While this platform primarily focuses on Microsoft 365-related topics, SPFx questions often require specialized guidance that is better suited to dedicated developer communities. 

We recommend posting your question on the following platform, where SPFx experts are actively engaged SharePoint Developer | Microsoft Community Hub This community is well-equipped to provide more targeted support and insights for SPFx development. 

Thanks again for your understanding, and we hope you're able to find the help you need quickly! 

---

If the answer is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".  

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread. 

Answer 2

I got it running. What I did was that I created a new web part which contains my report over view. Now it works. Must be a dependency or initialisation issue.