Background : I am working on one of the Office 365 Intranet project. We are developing SPFX component. In one of the scenario we need to change the web part id and so I created new GUID and replaces with original Id in”WebPart.manifest.json” as

String does not match the pattern of”^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$”.

ID

A universally unique component id. Each client side component is required to have this id. Once an id has been used for a component, it cannot be changed. A change in this value is treated same as the creation of a new component. Two components are never expected to have the same id.

Then I looked into the warning and realize the issue. I notice the difference between web part IDs.

The original ID of the web part in small letter and ID which I manually updated is in capital letters. Then I saw the regular expression which is in error and warning as well – ^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$ So I changed the new ID with small letters and I could execute gulp bundle –ship command successfully.

This seems to be weird issue but it’s by design. I didn’t understand the logic behind this.

Conclusion / Take away: Always use GUID in small case letters.

Thanks for reading 🙂

Keep reading, share your thoughts, experiences. Feel free to contact us to discuss more. If you have any suggestion / feedback / doubt, you are most welcome.

Stay tuned on Knowledge-Junction, will come up with more such articles