Error building Nuxt client: `Package import specifier "#build/nuxt.config.mjs" is not defined in package`
Description
Running nuxt dev after changing from @hey-api/client-fetch to @hey-api/client-nuxt (and re-building the client) throws the following:
ERROR [nuxt] [request error] [unhandled] [500]
Package import specifier "#build/nuxt.config.mjs" is not defined in package
(..)\node_modules\.pnpm\[email protected]_@[email protected]_@[email protected]_@[email protected]_better-sqlite3@11_2ct7njmhu3gpvfg3wk7372se64\node_modules\nuxt\package.json
imported from
(..)\node_modules\.pnpm\[email protected]_@[email protected]_@[email protected]_@[email protected]_better-sqlite3@11_2ct7njmhu3gpvfg3wk7372se64\node_modules\nuxt\dist\app\nuxt.js
I tried replicating it with a small sample, but I wasn't able to. Mostly wondering if there's any clues to why this might be happening, or if I'm doing something wrong.
Perhaps the most likely cuplrit is that I'm running with combatibilityversion 4 (in nuxt.config.ts)(:
future: {
compatibilityVersion: 4,
},
compatibilityDate: '2024-04-03',
openapi-ts.config.ts:
export default defineConfig({
input: 'https://localhost:7015/openapi/v1.json',
output: {
lint: 'eslint',
path: 'app/gilbert-api',
},
plugins: [
'@hey-api/client-fetch',
// '@hey-api/client-nuxt',
],
});
Reproducible example or configuration
No response
OpenAPI specification (optional)
No response
System information (optional)
package.json:
"dependencies": {
"@nuxt/ui-pro": "https://pkg.pr.new/@nuxt/ui-pro@43945f6",
"@nuxtjs/i18n": "^9.1.4",
"@pinia/nuxt": "^0.9.0",
"@tailwindcss/vite": "4.0.3",
"nuxt": "^3.15.4",
"pinia": "^2.3.1",
"tailwindcss": "4.0.3",
"vue": "^3.5.13",
"vue-i18n": "^11.1.0",
"vue-router": "4.5.0",
"zod": "^3.24.1"
},
"devDependencies": {
"@hey-api/client-fetch": "^0.7.3",
"@hey-api/client-nuxt": "^0.1.3",
"@hey-api/openapi-ts": "^0.63.2",
"@iconify-json/lucide": "^1.2.25",
"@nuxt/eslint": "^1.0.0",
"@nuxt/test-utils": "^3.15.4",
"@vue/test-utils": "^2.4.6",
"cross-env": "^7.0.3",
"eslint": "^9.19.0",
"happy-dom": "^16.8.1",
"playwright-core": "^1.50.1",
"ts-to-zod": "^3.15.0",
"typescript": "^5.7.3",
"vitest": "^3.0.4"
},
@rigtigeEmil so you used compatibilityVersion in your sample project and it didn't reproduce?
@mrlubos yeah, it's here: https://stackblitz.com/edit/nuxt-starter-t9st2hbw?file=nuxt.config.ts,app.vue
@rigtigeEmil I don't see you calling the client as you would in a real application. I fear there are too many variables as to what might be wrong. I tried building with 3.15.4 and compatibilityVersion set to 4 but it succeeded.
(base) ➜ openapi-ts git:(main) ✗ pnpm example nuxt build
> [email protected] example /Users/mrlubos/git/@hey-api/openapi-ts
> sh ./scripts/example.sh "nuxt" "build"
> @example/[email protected] build /Users/mrlubos/git/@hey-api/openapi-ts/examples/openapi-ts-nuxt
> nuxt build
[nuxi 8:23:50 PM] Nuxt 3.15.4 with Nitro 2.10.4
[nuxt 8:23:52 PM] ℹ Running with compatibility version 4
[nuxi 8:23:52 PM] ℹ Building for Nitro preset: node-server
[8:23:53 PM] ℹ Building client...
[8:23:53 PM] ℹ vite v6.0.11 building for production...
[8:23:55 PM] ℹ ✓ 174 modules transformed.
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/manifest.json 2.82 kB │ gzip: 0.45 kB
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/_nuxt/error-500.D2JmALe7.css 1.88 kB │ gzip: 0.72 kB
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/_nuxt/error-404.B5R4p8kg.css 3.56 kB │ gzip: 1.10 kB
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/_nuxt/d9Bg_rY9.js 0.47 kB │ gzip: 0.31 kB
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/_nuxt/aLLkGDyu.js 3.42 kB │ gzip: 1.54 kB
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/_nuxt/BFuuRhsk.js 9.44 kB │ gzip: 3.77 kB
[8:23:55 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/client/_nuxt/C66uyTli.js 209.35 kB │ gzip: 70.82 kB
[8:23:55 PM] ℹ ✓ built in 1.54s
[8:23:55 PM] ✔ Client built in 1563ms
[8:23:55 PM] ℹ Building server...
[8:23:55 PM] ℹ vite v6.0.11 building SSR bundle for production...
[8:23:56 PM] ℹ ✓ 119 modules transformed.
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-500-styles.CZT2I9XH.mjs 0.08 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-404-styles.wKLi4dRK.mjs 0.08 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-404-styles.BtSxAwS2.mjs 0.15 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-500-styles.D8xyG6Hu.mjs 0.15 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/styles.mjs 1.28 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/_plugin-vue_export-helper-B8P8R7cg.js 1.01 kB │ map: 1.86 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-500-styles-1.mjs-CbhsYk0K.js 2.10 kB │ map: 0.12 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-404-styles-1.mjs-DAW0LlpM.js 3.77 kB │ map: 0.12 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-500-DePv2HKh.js 4.88 kB │ map: 5.52 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/multipart-parser-K5Bv0CUV.js 6.92 kB │ map: 10.90 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/_nuxt/error-404-BSjrmwzt.js 14.51 kB │ map: 26.80 kB
[8:23:56 PM] ℹ node_modules/.cache/nuxt/.nuxt/dist/server/server.mjs 254.56 kB │ map: 488.37 kB
[8:23:56 PM] ℹ ✓ built in 886ms
[8:23:56 PM] ✔ Server built in 891ms
[nitro 8:23:56 PM] ✔ Generated public .output/public
[nitro 8:23:56 PM] ℹ Building Nuxt Nitro server (preset: node-server, compatibility date: 2024-11-01)
[nitro 8:23:58 PM] ✔ Nuxt Nitro server built
├─ .output/server/chunks/_/error-500.mjs (4.77 kB) (2.02 kB gzip)
├─ .output/server/chunks/_/error-500.mjs.map (336 B) (257 B gzip)
├─ .output/server/chunks/build/_plugin-vue_export-helper-B8P8R7cg.mjs (1.01 kB) (481 B gzip)
├─ .output/server/chunks/build/_plugin-vue_export-helper-B8P8R7cg.mjs.map (291 B) (226 B gzip)
├─ .output/server/chunks/build/client.manifest.mjs (3.48 kB) (564 B gzip)
├─ .output/server/chunks/build/client.manifest.mjs.map (204 B) (158 B gzip)
├─ .output/server/chunks/build/error-404-BSjrmwzt.mjs (14.7 kB) (4.54 kB gzip)
├─ .output/server/chunks/build/error-404-BSjrmwzt.mjs.map (567 B) (288 B gzip)
├─ .output/server/chunks/build/error-404-styles-1.mjs-DAW0LlpM.mjs (3.77 kB) (1.21 kB gzip)
├─ .output/server/chunks/build/error-404-styles-1.mjs-DAW0LlpM.mjs.map (122 B) (123 B gzip)
├─ .output/server/chunks/build/error-404-styles.BtSxAwS2.mjs (373 B) (207 B gzip)
├─ .output/server/chunks/build/error-404-styles.BtSxAwS2.mjs.map (249 B) (183 B gzip)
├─ .output/server/chunks/build/error-404-styles.wKLi4dRK.mjs (315 B) (205 B gzip)
├─ .output/server/chunks/build/error-404-styles.wKLi4dRK.mjs.map (239 B) (177 B gzip)
├─ .output/server/chunks/build/error-500-DePv2HKh.mjs (4.96 kB) (2.08 kB gzip)
├─ .output/server/chunks/build/error-500-DePv2HKh.mjs.map (342 B) (267 B gzip)
├─ .output/server/chunks/build/error-500-styles-1.mjs-CbhsYk0K.mjs (2.09 kB) (835 B gzip)
├─ .output/server/chunks/build/error-500-styles-1.mjs-CbhsYk0K.mjs.map (122 B) (123 B gzip)
├─ .output/server/chunks/build/error-500-styles.CZT2I9XH.mjs (315 B) (206 B gzip)
├─ .output/server/chunks/build/error-500-styles.CZT2I9XH.mjs.map (239 B) (181 B gzip)
├─ .output/server/chunks/build/error-500-styles.D8xyG6Hu.mjs (373 B) (208 B gzip)
├─ .output/server/chunks/build/error-500-styles.D8xyG6Hu.mjs.map (249 B) (184 B gzip)
├─ .output/server/chunks/build/multipart-parser-K5Bv0CUV.mjs (6.99 kB) (2.42 kB gzip)
├─ .output/server/chunks/build/multipart-parser-K5Bv0CUV.mjs.map (271 B) (196 B gzip)
├─ .output/server/chunks/build/server.mjs (255 kB) (59.6 kB gzip)
├─ .output/server/chunks/build/server.mjs.map (7.44 kB) (1.29 kB gzip)
├─ .output/server/chunks/build/styles.mjs (1.32 kB) (424 B gzip)
├─ .output/server/chunks/build/styles.mjs.map (186 B) (152 B gzip)
├─ .output/server/chunks/nitro/nitro.mjs (173 kB) (42.1 kB gzip)
├─ .output/server/chunks/nitro/nitro.mjs.map (5.78 kB) (1.07 kB gzip)
├─ .output/server/chunks/routes/renderer.mjs (13.9 kB) (4.43 kB gzip)
├─ .output/server/chunks/routes/renderer.mjs.map (728 B) (344 B gzip)
├─ .output/server/chunks/virtual/_virtual_spa-template.mjs (94 B) (100 B gzip)
├─ .output/server/chunks/virtual/_virtual_spa-template.mjs.map (112 B) (111 B gzip)
├─ .output/server/index.mjs (287 B) (188 B gzip)
└─ .output/server/package.json (648 B) (323 B gzip)
Σ Total size: 2.09 MB (494 kB gzip)
[nitro 8:23:59 PM] ✔ You can preview this build using node .output/server/index.mjs
@rigtigeEmil I will update the example to use compatibilityVersion just to be sure but this seems to be an issue somewhere else
My first stop would be to have a good look at the dependency tree and see if there are any incompatible versions installed. I could be way off base though
Paging @danielroe in case you know off the bat where to look!
In my own application, I get the exception without using the client - it simply throws on nuxt dev. I'll go through and add dependencies slowly, and see if they're the culprit. Thanks for the help!
@mrlubos I've managed to replicate it. It seems related to pnpm. I initially tried in stackblitz with npm, and it worked no problem. Moving to pnpm instead causes stackblitz to hang forever, and I assume it's because it's encountering the same error.
https://stackblitz.com/edit/nuxt-starter-t9st2hbw?file=app%2Fapp.vue
(cancel the initial npm installation and run pnpm i && pnpm dev instead)
A small reproduction where I receive the error is available here: https://github.com/rigtigeEmil/open-api-ts
edit:
Locally it makes no difference if I use npm or pnpm. Same error
@rigtigeEmil hmm, you see in my logs I'm using pnpm in this monorepo and not running into the same issue. My guess is still it's dependency related, let me know if there's anything I can do to help however!
@mrlubos I have no clue what the issue is, I'll just resort to the fetch client 🤷
If you have time, can try try cloning my repro from my previous comment, and see if you also get the same error?
@mrlubos sorry for pinging you in advance, but I cannot for the life of me get this to work. I tried the example app in this project and I'm getting the same error.
Do you have an idea what might be causing this?
I don't have any update since Monday, but I can have a look!
@mrlubos @rigtigeEmil Hello. I had the same issue and was able to resolve it by adding the following to nuxt.config.ts:
build: {
transpile: ['@hey-api/client-nuxt']
}
@IvanKushchenko Do you think this is something that should be fixed in the package?
@IvanKushchenko fantastic, this fixed it for me as well! Cheers
@mrlubos Honestly, I don't know, but I think it's more likely yes than no if there are ideas on how to fix it. I was able to solve the problem only in the context of the project. Maybe the same solution will help @rigtigeEmil and others who encounter the same issue.
@rigtigeEmil does this check out in terms of your target browsers? Maybe we'd add it as a tip so people know https://stackoverflow.com/a/72335894
@mrlubos I haven't modified anything in terms of browser targets. I get the error on a completely fresh Nuxt 3 project, just with client-nuxt and openapi-ts installed 🤷
https://github.com/rigtigeEmil/open-api-ts
I am a complete nuxt newbie, so this tip may not be helpful but maybe it actually is, so I gotta at least throw it in as an option.
According to this comment the error message is caused by importing from nuxt/app instead of #imports. I'm not sure if this applies to packages, but if it does, then maybe these imports are causing the issue?
Running into the same issue. The workaround shown above worked for me, though I don't think it's a long-term solution. ~~Oddly enough, I commented out the workaround, and I rolled back versions to before I had the issue (0.1.x of the nuxt client and openapi-ts), however, I can no longer replicate. Even after clearing .nuxt, .output, node_modules (and pnpm cache). Maybe there is some cache or similar that is still around which is preventing a reproducable environment.~~
Can we re-open this issue?
Was able to replicate with examples/openapi-ts-nuxt. All I did was replace the workspace:* version refs in package.json, and then ran pnpm run build && pnpm run preview. Some notes:
- Running
pnpm run devby itself doesn't produce the issue, it has to be a full build. - Pulling built packages from the pnpm workspace also doesn't produce the issue. It only seems to reproduce when I have the nuxt client pulled from the registry.
- Was going to test using
#imports, but since I can't use the pnpm workspace, it makes it hard to properly test.- I was looking at how some other packages do it, and I did notice
#importsbeing used here: https://github.com/enkot/nuxt-open-fetch/blob/main/src/runtime/nuxt-plugin.ts#L1C87-L1C95
- I was looking at how some other packages do it, and I did notice
EDIT: guess https://github.com/hey-api/openapi-ts/issues/1723 already mentioned the reproducibility. Nevermind then. 😄
This will be fixed soon, thank you for your patience!
@mrlubos can related pr be merged, or is something holding it up?
Yes. Something = me. I've been heads down on releasing the platform, will polish the Nuxt module hopefully this week
@rigtigeEmil @eszterczotter do you want to try? https://www.npmjs.com/package/@hey-api/nuxt
Literally just released it so bear with me if it has some rough edges!
export default defineNuxtConfig({
heyApi: {
config: {
input: 'path/to/openapi.json',
},
},
modules: ['@hey-api/nuxt'],
});
@mrlubos just starting testing it out. some things I've noticed so far (haven't tested much yet still):
- if
indexFileis false, it will fail because it can't find theindex.tsfile. Setting it to true generates it, and the inverse does still delete the index file, it just throws an error and fails to startup nuxt.
[ nuxi 11:42:50 PM] ERROR Cannot restart nuxt: ENOENT: no such file or directory, open '/home/liam/go/src/github.com/lrstanley/liam.sh/cmd/httpserver/public-new/app/utils/http/index.ts'
at Object.readFileSync (node:fs:442:20)
at setup (node_modules/.pnpm/@[email protected][email protected][email protected]_@[email protected]_@[email protected]_db0@_7bzo27ox763f2nkdo774qrkhpa/node_modules/@hey-api/nuxt/dist/module.mjs:40:12)
at async normalizedModule (node_modules/.pnpm/@[email protected][email protected]/node_modules/@nuxt/kit/dist/index.mjs:2149:17)
at async installModule (node_modules/.pnpm/@[email protected][email protected]/node_modules/@nuxt/kit/dist/index.mjs:2488:276)
at async initNuxt (node_modules/.pnpm/[email protected]_@[email protected]_@[email protected][email protected][email protected]_lightningcss@1._53xdjbxnrhc63nd567dsmd6nea/node_modules/nuxt/dist/shared/nuxt.B7-cu52A.mjs:5735:5)
at async NuxtDevServer._load (node_modules/.pnpm/@[email protected][email protected]/node_modules/@nuxt/cli/dist/chunks/dev2.mjs:165:5)
at async NuxtDevServer.load (node_modules/.pnpm/@[email protected][email protected]/node_modules/@nuxt/cli/dist/chunks/dev2.mjs:95:7)
at async _applyPromised (node_modules/.pnpm/[email protected]/node_modules/perfect-debounce/dist/index.mjs:54:10)
- When initially adding the module, it fails to generate the types in the
nuxt.config.tsbecause the config hasn't been specified yet:
ERROR 🔥 Unexpected error occurred. Log saved to /home/liam/go/src/github.com/lrstanley/liam.sh/cmd/httpserver/public-new/openapi-ts-error-1741758046212.log 11:40:46 PM
ERROR 🔥 Unexpected error occurred. 🚫 missing input - which OpenAPI specification should we use to generate your output? 11:40:46 PM
ERROR 🚫 missing input - which OpenAPI specification should we use to generate your output?
Thus making it hard to add all of the configuration, because nuxt can't bootstrap the types. I imagine the common workflow for modules that require inputs in the nuxt.config.ts file is:
add module into nuxt.config.ts -> nuxt restarts & bootstraps types -> user can now add `heyApi` block with full types
May be worth making it so if the nuxt config isn't provided, but the module is used, it throws a warning (or, maybe it throws a warning only during development, but fails during a full compilation/build?).
Thanks as always @lrstanley? Do you know how to detect build/compilation vs development?
Overall, does it feel like the right step with this module over using a client?
Other than the index issue (I assume this is because of the auto-imports, which I'm fine leaving index.ts if it means I get auto-imports, though it should probably be a better error), and the "getting started" phases, further testing seems good. no more of the previous errors during compilation.
Do you know how to detect build/compilation vs development?
I don't unfortunately. I imagine there is probably a way, though.
As far as if this is the right approach -- with my project, I was actually doing something almost identically already. I moved from the static config file + cli invocation, to using a nuxt hook with the library method, that way anytime I changed the config, nuxt dev server starts up, or during build, it gets invoked. See here:
https://github.com/lrstanley/liam.sh/blob/88c4f9aeb0caebc3f7ff79b3b65749385b9c2557/cmd/httpserver/public-new/nuxt.config.ts#L56-L85
Not sure how much extra work it is to maintain a dedicated module vs what I was doing before/making the other changes to fix the original issue.
Do you still need to transpile anything with the module or the latest client? We've dropped the CJS build and it's now ESM only.
Regarding your approach, does it automatically import anything? I assume no. How do you feel about the import being from '#hey-api/sdk.gen.ts' by default? Side note, I'm meant to remove .gen from those files since it's assumed the whole module is generated.
The index issue is totally on my end, no tradeoffs for you. I guess when there's no index file, there'd be no auto import? This one seems the easiest to fix as I just need to check if the index file exists (it currently assumes it does hence the error)
I don't need to have the transpile override in my config anymore. I assume it's because you're adding that transpile line inside of the module.
Switched everything over to auto imports, types, schema, and sdk. Works great. haven't tested manually importing anything/importing from the alias yet. Does it still need an output path? If so, wonder if there is a way to generate it so it goes into the .nuxt folder/is hidden out of view from the user, otherwise they might still try importing the normal way (from the output path folder).
Haven't tried without the index file because it fails to run dev mode without it.
Will test other scenarios if I get a chance tomorrow.