Azure maps not loading in D365 Ecommerce production build

Question

Azure-maps-control is not loading properly in the production build of Microsoft D365 Ecommerce application. We are seeing ReferenceError: Cannot access <something> before Initialisation

Found some relevant issue in azure maps github pages. Looks like the issue is with webpack and terser minification. The map loads properly in production if minimizer is disabled . However, we are looking for a workaround as exposing source code is not advisable. https://github.com/Azure/react-azure-maps/issues/187

https://github.com/Azure/react-azure-maps/issues/193

For Ecommerce, we have this starter project on top of which our customers can have their Customizations. https://github.com/microsoft/Msdyn365.Commerce.Online . I tried implementing the suggestion in the github issues pages but none of them worked for this Ecommerce repository.

However the azure maps control works fine in production build for a React project created with Create React App (CRA). I managed to imitate the same webpack and terser configurations from the React App to our Ecommerce repository but its still failing in production build.

Note : We are using azure-maps-control version 3.5.0 I also tried using other minimizer like esbuild but got Failed to load error in the map module.