node.jsnuxt.jsmonorepopnpm-workspace

Nuxt App in Monorepo Fails to Compile and Shows a Vanilla Template When Outside Repository


I have a monorepo containing two Nuxt 4 apps and a NestJS application. The NestJS app works fine as expected without any issues.

However, when I try to run either of the two Nuxt applications, I encounter the following error:

PS C:\Repository\monorepo\apps\pwa-client> npm run dev

> pwa-client@0.0.1 dev
> nuxt dev --debug

Nuxt 3.14.159 with Nitro 2.10.4                                                                                                                           5:28:35 PM
                                                                                                                                                              5:28:35 PM
  ➜ Local:    http://localhost:3200/
  ➜ Network:  use --host to expose

ℹ Using default Tailwind CSS file                                                                                                       nuxt:tailwindcss 5:28:37 PM
  ➜ DevTools: press Shift + Alt + D in the browser (v1.6.0)                                                                                               5:28:38 PM

pwa-client is starting...                                                                                                                                 5:28:39 PM
ℹ Tailwind Viewer: http://localhost:3200/_tailwind/                                                                                     nuxt:tailwindcss 5:28:39 PM
✔ Vite client built in 105ms                                                                                                                             5:28:39 PM
✔ Vite server built in 812ms                                                                                                                             5:28:40 PM
✔ Nuxt Nitro server built in 825 ms                                                                                                                nitro 5:28:42 PM
ℹ Vite client warmed up in 1ms                                                                                                                           5:28:42 PM

 ERROR  [worker reload] [worker init] C:/Repository/monorepo/apps/pwa-client/.nuxt/dev/index.mjs failed                                            5:28:42 PM

ℹ Vite server warmed up in 870ms  

If I move the folder containing the app to a directory outside of the monorepo, run npm install and then npm run dev it starts without any errors. However, it displays the vanilla starter app that you get when you set up a new Nuxt project, and not what is in the app.

Excluding the project from the npm workspace results in the same behavior.

I have tried deleting all the following directories in the monorepo:

.nuxt .output node_modules

After deletion, I ran npm install and then npm run dev but the behavior remains unchanged.

Interestingly If deploy it to Cloudflare Pages. It generates the default inicial Nuxt app.

Here is my nuxt.config.ts:

import { defineNuxtConfig } from "nuxt/config";
import type { NuxtConfig } from "nuxt/schema";
import * as dotenv from "dotenv";
import * as path from "path";

// Load .env from the monorepo root
dotenv.config({ path: path.resolve(__dirname, "../../.env") });

const config: NuxtConfig = {
  // Server configuration
  devServer: {
    port: parseInt(process.env.PWA_CLIENT_PORT ?? "3200", 10),
  },

  // Modules configuration
  modules: ["@nuxtjs/tailwindcss", "nuxt-gtag"],

  // Enable devtools in development mode
  devtools: { enabled: process.env.NODE_ENV === "development" },

  // Compatibility date for Nuxt
  compatibilityDate: "2024-10-23",

  // Nitro configuration for server-side rendering and deployment
  nitro: {
    logLevel: process.env.NODE_ENV === "development" ? 4 : 2, // 0: none, 1: error, 2: warn, 3: info, 4: debug
  },

  // TypeScript configuration
  typescript: {
    strict: true,
    typeCheck: true,
  },

  hooks: {
    ready: () => {
      console.log("pwa-client is starting...");
    },
  },
};

export default defineNuxtConfig(config);

Solution

  • I am not sure what happened, but I switching from NPM to PNPM, and that resolved my problem.

    It could be that in doing the transition, I corrected a missed configuration or removed a temp folder, such as .nuxt, that I had previously missed.