"dirname" is not exported by "__vite-browser-external", imported by "nuxt.config.ts"
I have a Nuxt layer that I publish to a private NPM feed, and install into a few different Nuxt sites. After updating to Nuxt 3.16, some of the sites error like this when building:
WARN [plugin vite:resolve] Module "url" has been externalized for browser compatibility, imported by "~/node_modules/my-layer/nuxt.config.ts".
WARN [plugin vite:resolve] Module "path" has been externalized for browser compatibility, imported by "~/node_modules/my-layer/nuxt.config.ts".
✓ 1056 modules transformed.
ERROR ✗ Build failed in 58.83s
ERROR Nuxt Build Error: node_modules/my-layer/nuxt.config.ts (2:9): "dirname" is not exported by "__vite-browser-external", imported by "node_modules/my-layer/nuxt.config.ts". nuxi
file: ~/node_modules/my-layer/nuxt.config.ts:2:9
1: import { fileURLToPath } from "url";
2: import { dirname, join } from "path";
^
3: // This is used to resolve full paths to the CSS files, per https://nuxt.com/docs/guide/going-further/layers#relative-paths-and-aliases
4: const currentDir = dirname( fileURLToPath( import.meta.url ) );
I've diffed my sites' package.json and nuxt.config.ts files and can't see any clues as to why some work and some don't. Package updates don't make a difference. All run the same version of Node and pnpm. Switching package manager to npm didn't help. Changing the imports in the Nuxt layer to include node: didn't help.
Any ideas, anyone? Thanks in advance
WARN [plugin vite:resolve] Module "url" has been externalized for browser compatibility, imported by "~/node_modules/my-layer/nuxt.config.ts".
WARN [plugin vite:resolve] Module "path" has been externalized for browser compatibility, imported by "~/node_modules/my-layer/nuxt.config.ts".
✓ 1056 modules transformed. ERROR ✗ Build failed in 58.83s
ERROR Nuxt Build Error: node_modules/my-layer/nuxt.config.ts (2:9): "dirname" is not exported by "__vite-browser-external", imported by "node_modules/my-layer/nuxt.config.ts". nuxi
file: ~/node_modules/my-layer/nuxt.config.ts:2:9
1: import { fileURLToPath } from "url";
2: import { dirname, join } from "path";
^
3: // This is used to resolve full paths to the CSS files, per https://nuxt.com/docs/guide/going-further/layers#relative-paths-and-aliases
4: const currentDir = dirname( fileURLToPath( import.meta.url ) );
I've diffed my sites' package.json and nuxt.config.ts files and can't see any clues as to why some work and some don't. Package updates don't make a difference. All run the same version of Node and pnpm. Switching package manager to npm didn't help. Changing the imports in the Nuxt layer to include node: didn't help.
Any ideas, anyone? Thanks in advance
Nuxt
Nuxt provides a powerful system that allows you to extend the default files, configs, and much more.
