Fix issue with require by replacing with dynamic imports for ES module compatibility

[michaelnabil230]

Title:

Fix issue with require by replacing with dynamic imports for ES module compatibility

Description:

Problem:

The current code uses require to conditionally import modules, which is not compatible with ES module syntax in modern JavaScript environments. Specifically, using require causes the following error in the browser:

Uncaught (in promise) ReferenceError: require is not defined

This issue arises because require is a Node.js feature, and browsers do not support it natively.

Solution:

To resolve this, I replaced the require statements with dynamic import() syntax, which is compatible with ES modules and works in the browser environment. Additionally, I exported placeholder variables initially, and then conditionally imported the necessary modules asynchronously. This ensures the modules are loaded correctly when needed while keeping the exports valid and compatible with ES module standards.

This change fixes the error and improves the compatibility of the code with modern JavaScript frameworks and browsers.