app-vite v2 rc2 - '#q-app' alias is not recognized in yarn/bun monorepo

[ariel-overa]

What happened?

After upgrading @quasar/app-vite from "^2.0.0-beta.24" to "^2.0.0-rc.2" and following the migration guide, typescript does not recognize the imports from '#q-app/wrappers', for example in quasar.config.ts.

I'm getting the following error:
Cannot find module '#q-app/wrappers' or its corresponding type declarations.ts(2307)

After investigating the issue, I found that the tsconfig.json generated under .quasar directory does not correctly map the paths related to node_modules.

For example:
"#q-app": [
"./../node_modules/@quasar/app-vite/types/index.d.ts"
],

In my environment, there's no node_modules in this location, because the quasar project is under a monorepo. For my environment, the correct should be:

"#q-app": [
"./../../../node_modules/@quasar/app-vite/types/index.d.ts"
],

That is, node_modules is two directory levels behind what was generated.

What did you expect to happen?

quasar prepare should generate .quasar/tsconfig.json considering the correct location of node_modules.

Reproduction URL

https://stackblitz.com/edit/quasarframework-stackblitz-templates-zkxysz?file=packages%2Fquasar-project%2Fquasar.config.ts

How to reproduce?

Upgrade @quasar/app-vite from "^2.0.0-beta.24" to "^2.0.0-rc.2" in a monorepo environment.

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

TypeScript Support, SPA Mode

Platforms/Browsers

Microsoft Edge

Quasar info output

Operating System - Linux(5.15.167.4-microsoft-standard-WSL2) - linux/x64
NodeJs - 22.9.0

Global packages
  NPM - 10.8.3
  yarn - 1.22.22
  pnpm - 9.12.1
  bun - 1.1.34
  @quasar/cli - 2.4.1
  @quasar/icongenie - Not installed
  cordova - Not installed

Important local packages
  quasar - 2.17.4 -- Build high-performance VueJS user interfaces (SPA, PWA, SSR, Mobile and Desktop) in record time
  @quasar/app-vite - 2.0.0-rc.2 -- Quasar Framework App CLI with Vite
  @quasar/extras - 1.16.13 -- Quasar Framework fonts, icons and animations
  eslint-plugin-quasar - Not installed
  vue - 3.5.13 -- The progressive JavaScript framework for building modern web UI.
  vue-router - 4.4.5
  pinia - 2.2.6 -- Intuitive, type safe and flexible Store for Vue
  vuex - Not installed
  vite - 6.0.0-beta.10 -- Native-ESM powered web dev build tool
  vite-plugin-checker - Not installed
  eslint - 8.57.1 -- An AST-based pattern checker for JavaScript.
  esbuild - 0.23.1 -- An extremely fast JavaScript and CSS bundler and minifier.
  typescript - 5.6.3 -- TypeScript is a language for application scale JavaScript development
  workbox-build - Not installed
  register-service-worker - Not installed
  electron - Not installed
  @electron/packager - Not installed
  electron-builder - Not installed
  @capacitor/core - Not installed
  @capacitor/cli - Not installed
  @capacitor/android - Not installed
  @capacitor/ios - Not installed

Quasar App Extensions
  *None installed*

Networking
  Host - f7e9380d5dfd
  br-5053dddd48ed - 172.19.0.1
  eth0 - 172.17.0.3

Relevant log output

No response

Additional context

No response

[yusufkandemir]

./../node_modules/.... path is inside .quasar/tsconfig.json, so it maps to your-quasar-project/node_modules. I've tested it in the repro you sent, and there is a node_modules folder there:

So, please provide a detailed and reproducible reproduction. Which package manager you are using? Can you also share your directory structure, any monorepo-related configuration(e.g. package.json > workspaces or pnpm-workspace.yaml), and any .npmrc configuration you have?

[yusufkandemir]

I think I get what you mean here, node_modules exists, but it doesn't have @quasar/app-vite. pnpm creates a symlink in project/node_modules -> monorepo/node_modules. But, yarn doesn't seem to be doing such a thing. So, we need to figure out a way.

[ariel-overa]

Yes, exactly. I'm using bun as package manager.

[yusufkandemir]

I've found a solution, but I will test it further tomorrow morning.