Dynamic import
const PromptComponent = dynamic(
() => import(`./prj/${name}/index.jsx`)
);
/*
Because you’re passing a computed path string into import(),
Next.js (and Node’s ESM loader) can’t resolve it at build time or even
at runtime the way you expect. When you write:
await import(`./prj/${prjDirname}/instructions.meta.mjs`);
the bundler can see the literal string pattern and include that file in the build. But when you do:
await import(`./${mjsPath}`);
mjsPath is a variable ("./prj/foo/instructions.meta.mjs"), so the bundler
doesn’t know which modules to include, and at runtime Node’s ESM resolver
still treats it as a different (and likely incorrect) relative path (e.g. "././prj/foo/…").
*/
async function importMjs(prjDirname) {
const mjsPath = `./prj/${prjDirname}/instructions.meta.mjs`;
//const { meta } = await import(mjsPath); ❌
//const { meta } = await import(`./${mjsPath}`); ❌
const { meta } = await import(`./prj/${prjDirname}/instructions.meta.mjs`); // ✅: Only this way works
return meta;
}