Does Quasar Support pnpm Monorepo Setup?

[pinghe]

Hello everyone,

I am in the process of setting up a monorepo project with pnpm as the package manager. Within this monorepo, I have a main application developed with Quasar, and also within the packages directory, there is another application developed with Quasar.

Currently, I am encountering an issue where it seems that the monorepo structure is not supported by the Quasar CLI. Specifically, I am facing the following problems:

When trying to run quasar dev or quasar build commands, I am receiving an error indicating that the Quasar CLI does not allow execution within a monorepo structure.

I have attempted to run the Quasar CLI separately for each application from the root of the monorepo, but it still doesn't work as expected.

I would like to inquire if anyone has come across a similar issue, or if there are any recommended solutions? Is there official support or a workaround to achieve this structure?

Any advice or guidance would be greatly appreciated.

Thank you!

[pinghe]

root
    package.json
    - packages
             - mainApp(quasar)
                     package.json  dependencies- "childApp": "workspace:*",  // failed
             - childApp

current:

root(main quasar)
      quasar.config.js
      package.json  dependencies- "childApp": "workspace:*",  // failed
      - packages
             - childApp(quasar)  

[rstoenescu]

It certainly does work with monorepos. I assume that you are using PNPM with it? Make sure that you have this in your /.npmrc:

# pnpm-related options
shamefully-hoist=true
strict-peer-dependencies=false
# to get the latest compatible packages when creating the project https://github.com/pnpm/pnpm/issues/6463
resolution-mode=highest

[lugrinder]

Hi, I have a monorepo using pnpm (quasar front end and expressjs backend), and mainly works, but with some issues. When I run quasar upgrade or pnpm quasar upgrade in the quasar repo, I get an the next error:

npm error code ENOWORKSPACES.
npm error This command does not support workspaces.

How can I upgrade quasar with pnpm in a monorepo? It seems that is trying to use npm for the upgrade instead of pnpm.

[yusufkandemir]

Now I pretty much highly suspect you have npm workspace configuration like package.json > workspaces somewhere. Can you verify if that's the case?

[yusufkandemir]

Btw, due to npm/cli#6099, npm config command doesn't work in workspaces. So, that is why this error is happening.

[lugrinder]

Now I pretty much highly suspect you have npm workspace configuration like package.json > workspaces somewhere. Can you verify if that's the case?

Yes, that's the problem. I've migrated the two apps to a monorepo, and at first attempt, I've done with npm adding workspace to the monorepo package. Thank you very much for your help.

I've asked for support in #15941 about importing from backend into quasar package. Can you help me about this? This is the main reason for the monorepo creation, keep types (I'm using typescript) in sync from backend and quasar.

[yusufkandemir]

For direct usage of the server package in the client, you need to use deep imports like @my-scope/server-pkg/src/something/whatever. If the file contains decorators, or node-specific lib code, you would need to split the file into a "type-only" file and the rest. So, make sure there are only types or code that can run on the client.

For a relatively more complex but better solution, you would need to create a shared package in your monorepo. Then, you'd use that package in the client and the server.

[lugrinder]

For direct usage of the server package in the client, you need to use deep imports like @my-scope/server-pkg/src/something/whatever. If the file contains decorators, or node-specific lib code, you would need to split the file into a "type-only" file and the rest. So, make sure there are only types or code that can run on the client.

I've done that, was my first action, but don't work. But I've solved (accidentally) the problem with a simple solution (added yesterday for other questions): adding the scope to the build.alias of quasar.conf.js.

For a relatively more complex but better solution, you would need to create a shared package in your monorepo. Then, you'd use that package in the client and the server. Now builds without any error.

This is my intention.

Thank you very much for your help.

[lugrinder]

@yusufkandemir I have a minor issue with install/build in the monorepo that I hope that you can help. If I install in the root with pnpm install, the backend builds without any problem, but the quasar package shows errors on missing dependencies:

[vite]: Rollup failed to resolve import "register-service-worker" from "src-pwa/register-service-worker.ts".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

But If I install inside the quasar package, builds now works without any problem...

[yusufkandemir]

Make sure the monorepo is set up properly. You can run pnpm m ls --depth -1 to see if the Quasar project is properly included in the monorepo. Move the .npmrc file from the Quasar project to the monorepo root. Here is an example .npmrc file that should be in the monorepo root:

# pnpm-related options
shell-emulator=true
shamefully-hoist=true
strict-peer-dependencies=false

[yusufkandemir]

Also, register-service-worker is a bit suspicious as it used to be provided from the app-* packages, but now should be installed into the project by the user. So, make sure it is inside your package.json.

[lugrinder]

Moving .npmrc to root was sufficient. Thanks.