importUI()

The importUI function simplifies UI component imports using aliases from a JSON configuration, promoting a modular and organized project structure for improved code manageability.

Example of importing a header file to a listing page.

  • config.json header file:

"aliases": [
    {
        "fileName": "header.tsx",
        "alias": "@header"
    }
]
  • Listing Page:

import { importUI } from '@magicjs.dev/frontend';

const Header = importUI("@mern.ai/header");

return (
    <div>
        <Header />
        <div>
            {/* Other components */}
        </div>
    </div>
);

Click here to refer GitHub.

Last updated