Nuxt Frontend fails to run in development or production, Circular dependency issue Export "useNitroApp"

[taogaetz]

First of all, huge thank you to the Directus team and @bryantgillespie for building this amazing template, barebones directus is so cool, and i'm really excited to try out this full featured template, it's extremely suited to my needs.

Also, this issue is related to the frontend nuxt app for the marketing site & client portal; directus and the template's data studio spin up fine with docker compose.

Env info:
OS: MacOS running Directus via the included .directus/docker-compose.yaml
Node Version: v18.20.4
Nuxt Version: 3.12.4
Nitropack version: 2.9.7

Expected behaviour:

npm run dev

--> Now running Dev server at your url

Observed behaviour:

npm run dev

[4:32:37 p.m.]  ERROR  [worker reload] [worker init] Package import specifier "#internal/nitro/virtual/plugins" is not defined in package <HOME_DIR>/agency-os/node_modules/nitropack/package.json imported from <HOME_DIR>/agency-os/node_modules/nitropack/dist/runtime/app.mjs

  at __node_internal_captureLargerStackTrace (node:internal/errors:496:5)
  at new NodeError (node:internal/errors:405:5)
  at importNotDefined (node:internal/modules/esm/resolve:353:10)
  at packageImportsResolve (node:internal/modules/esm/resolve:803:9)
  at moduleResolve (node:internal/modules/esm/resolve:967:16)
  at defaultResolve (node:internal/modules/esm/resolve:1206:11)
  at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:404:12)
  at ModuleLoader.resolve (node:internal/modules/esm/loader:373:25)
  at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:250:38)
  at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:39)
  at link (node:internal/modules/esm/module_job:75:36)

npm run build

✔ Generated public .output/public                                                                                                               nitro 4:40:30 p.m.
ℹ Building Nuxt Nitro server (preset: node-server)                                                                                              nitro 4:40:31 p.m.
Export "useNitroApp" of module "../../node_modules/nitropack/dist/runtime/app.mjs" was reexported through module "virtual:#imports" while both modules are dependencies of each other and will end up in different chunks by current Rollup settings. This scenario is not well supported at the moment as it will produce a circular dependency between chunks and will likely lead to broken execution order.
Either change the import in "node_modules/@nuxtjs/sitemap/dist/runtime/nitro/routes/sitemap_index.xml.js" to point directly to the exporting module or reconfigure "output.manualChunks" to ensure these modules end up in the same chunk.
✔ Nuxt Nitro server built             

**npm run preview:**

TypeError [ERR_PACKAGE_IMPORT_NOT_DEFINED]: Package import specifier "#internal/nitro/virtual/app-config" is not defined in package /<HOME_DIR>/agency-os/.output/server/node_modules/nitropack/package.json imported from /<HOME_DIR>/Dev/agency-os/.output/server/node_modules/nitropack/dist/runtime/config.mjs
    at new NodeError (node:internal/errors:405:5)
    at importNotDefined (node:internal/modules/esm/resolve:353:10)
    at packageImportsResolve (node:internal/modules/esm/resolve:803:9)
    at moduleResolve (node:internal/modules/esm/resolve:967:16)
    at defaultResolve (node:internal/modules/esm/resolve:1206:11)
    at ModuleLoader.defaultResolve (node:internal/modules/esm/loader:404:12)
    at ModuleLoader.resolve (node:internal/modules/esm/loader:373:25)
    at ModuleLoader.getModuleJob (node:internal/modules/esm/loader:250:38)
    at ModuleWrap.<anonymous> (node:internal/modules/esm/module_job:76:39)
    at link (node:internal/modules/esm/module_job:75:36) {
  code: 'ERR_PACKAGE_IMPORT_NOT_DEFINED'
}

[taogaetz]

npx nuxi info:

- Operating System: `Darwin`
- Node Version:     `v18.20.4`
- Nuxt Version:     `3.12.4`
- CLI Version:      `3.12.0`
- Nitro Version:    `2.9.7`
- Package Manager:  `[email protected]`
- Builder:          `-`
- User Config:      `routeRules`, `extends`, `components`, `css`, `modules`, `experimental`, `runtimeConfig`, `directus`, `devtools`, `colorMode`, `image`, `googleFonts`, `site`, `ogImage`, `sitemap`, `postcss`, `build`, `compatibilityDate`
- Runtime Modules:  `@nuxt/[email protected]`, `@nuxt/[email protected]`, `@nuxtjs/[email protected]`, `@nuxtjs/[email protected]`, `@nuxtjs/[email protected]`, `@formkit/auto-animate/[email protected]`, `@vueuse/motion/[email protected]`, `@vueuse/[email protected]`, `@nuxt/[email protected]`
- Build Modules:    `-`