Failed to create application customizer

Hey Everyone,

Today, I am gonna share one issue and also share its solution with you. Today, I was working with one SPFx Application Customizer with the latest SPFx 1.21.1 and node v22 and all the latest dependencies.

While I have set up the project, and then I ran the solution, it gave me an error as  shown in the image below 

Actually, I have already written a blog about this issue. There is another parameter that causes the issues, so if you face this type of issue, then you can refer to that blog as well. The link is https://www.c-sharpcorner.com/blogs/spfx-application-customizer-error-failed-to-load-component

Now, let's talk about why these errors occur even if things go the right way. First it tried the approach which I talked about in the previous blog but didn't work for the latest.

So, while you build an application customizer, the first thing to check is the React version. Even in the documentation of microsoft, they have not mentioned that [email protected] will work with SPFx latest 1.21.1; in fact, the right version is [email protected]. 

You can check by clicking on the link below 

SPFx version compatibility matrix.

Now, if you have built an application customizer and you face this type of issue, just check the React version because when you install the latest version, it will provide you with 17.0.2, and that is the cause of the issue.

So run the command below to install React version 17.0.1 

npm i [email protected] 
npm i [email protected]