Vite >=3.0.1 fails to resolve projects in monorepo #9202

lukashroch · 2022-07-18T21:42:26Z

Describe the bug

Vite 3.0.1 and higher does not seem to resolve projects within the monorepo.

E.g. we got structure:

├─ apps
│  └─ app1
          └─ vite.config.ts
│  └─ app2
└─ packages
   └─ package1
   └─ package2

Since vite@3.0.1., I'm getting the error below:

Error: Cannot find module 'C:\Apps\repo\packages\common\src\types'
Require stack:
- C:\Apps\repo\apps\admin\vite.config.ts
- C:\Apps\repo\node_modules\.pnpm\vite@3.0.2_sass@1.32.13\node_modules\vite\dist\node\chunks\dep-1513d487.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (C:\Apps\repo\apps\admin\vite.config.ts:117:20)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object._require.extensions.<computed> [as .js] (file:///C:/Apps/repo/node_modules/.pnpm/vite@3.0.2_sass@1.32.13/node_modules/vite/dist/node/chunks/dep-1513d487.js:62817:24)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)

This was working fine up till vite@3.0.0 and breaks in vite@3.0.1 and up.

Vite now fails on relative import in vite.config.ts

import { something } from '../../packages/common/src/types';

Is there a more proper way to do this in vite?

Reproduction

https://stackblitz.com/edit/vitejs-vite-wg28sd?file=apps/app/vite.config.ts

cd apps/app
npm install
npm run build

System Info

System:
    OS: Windows 10 10.0.22000
    CPU: (4) x64 Intel(R) Core(TM) i3-8100 CPU @ 3.60GHz
    Memory: 3.85 GB / 15.86 GB
  Binaries:
    Node: 16.13.0 - C:\Program Files\nodejs\node.EXE
    npm: 8.1.0 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Chrome: 103.0.5060.114
    Edge: Spartan (44.22000.120.0), Chromium (102.0.1245.44)
    Internet Explorer: 11.0.22000.120

pnpm@v6.33.1

Used Package Manager

pnpm (own project) / npm (stackblitz)

Logs

Error: Cannot find module 'C:\Apps\repo\packages\common\src\types'
Require stack:
- C:\Apps\repo\apps\admin\vite.config.ts
- C:\Apps\repo\node_modules\.pnpm\vite@3.0.2_sass@1.32.13\node_modules\vite\dist\node\chunks\dep-1513d487.js
    at Function.Module._resolveFilename (node:internal/modules/cjs/loader:933:15)
    at Function.Module._load (node:internal/modules/cjs/loader:778:27)
    at Module.require (node:internal/modules/cjs/loader:1005:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (C:\Apps\repo\apps\admin\vite.config.ts:117:20)
    at Module._compile (node:internal/modules/cjs/loader:1101:14)
    at Object._require.extensions.<computed> [as .js] (file:///C:/Apps/repo/node_modules/.pnpm/vite@3.0.2_sass@1.32.13/node_modules/vite/dist/node/chunks/dep-1513d487.js:62817:24)
    at Module.load (node:internal/modules/cjs/loader:981:32)
    at Function.Module._load (node:internal/modules/cjs/loader:822:12)
    at Module.require (node:internal/modules/cjs/loader:1005:19)

Validations

Follow our Code of Conduct
Read the Contributing Guidelines.
Read the docs.
Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
The provided reproduction is a minimal reproducible example of the bug.

The text was updated successfully, but these errors were encountered:

bluwy · 2022-07-19T13:40:36Z

Likely a regression from #9140. We're bundling the Vite config and all the related files, but because the relative imports point to a file from a package that could have it's own node_modules, we can't bundle that file. So what happens is that node is trying to load the file in runtime, which doesn't work as it doesn't handle TS.

The original issue looks like a workaround for #5370, which doesn't work in the first place. Given this had worked in Vite 3.0.0, maybe it's worth finding a reasonable fix at the meantime, but the better solution overall is to compile the package as JS first.

- temp workaround for vitejs/vite#9202

lukashroch · 2022-07-19T17:22:22Z

@bluwy thanks for your reply, I see that now!

It doesn't make much sense for me to build it in this particular case as it's mostly various shared code being pulled in to apps that take care of the build, whatever if pulled in. Also I had couple of reusable fragments for vite.config.ts in that place as we have multiple vue apps, so wanted to share same pieces. And that's when I started to have issues with vite@>=3.0.1.

For now, I ended up extracting fragments for vite build out of package with package.json / node_modules, which works OK as expected. But if this could be fix, that would be great.

bluwy · 2022-07-21T16:39:39Z

I've been thinking about this and it's quite tricky in general to support this. It's either:

We rewrite the import paths for files in a different package.
Or bundle the file's dependencies.

And both aren't really good choices. The logic for bundling config files is also quite complex now since we had recent issues after Vite 3, and I'm hoping to not touch it anymore.

We might have to intentionally break this in 3.0.1 (even though I hate to break semver), but given that it's a workaround before, and it's only 1 patch away. Maybe that's still acceptable.

KubaJastrz · 2022-07-26T10:25:58Z

Same thing happens with vitest@^0.17, as it uses the same mechanism for compiling TS config file.

the better solution overall is to compile the package as JS first

What if you don't have a compilation step? I'm using a shared package for defining config like so: https://stackblitz.com/edit/vitejs-vite-esn1xa?file=app%2Fvite.config.ts

It worked with vite@=<3.0.0.

Edit: interestingly enough, when you remove common/package.json, Vite compiles...

danielrozenberg · 2022-07-29T17:25:56Z

We found a workaround that works for our project, it might work for others (ymmv):

We figured out that we can run Vite through tsx (previously esno). i.e., instead of calling vite we call tsx node_modules/.bin/vite

o-alexandrov · 2022-07-30T17:28:45Z

We found a workaround that works for our project, it might work for others (ymmv):

We figured out that we can run Vite through tsx (previously esno). i.e., instead of calling vite we call tsx node_modules/.bin/vite

In a project w/ package.json "type": "module", using tsx on the vite's executable fails with:

Click to expand

{
  errors: [
    {
      detail: undefined,
      id: '',
      location: {
        column: 18,
        file: '../node_modules/.bin/vite.js',
        length: 9,
        line: 2,
        lineText: `basedir=$(dirname "$(echo "$0" | sed -e 's,\\\\,/,g')")`,
        namespace: '',
        suggestion: ')'
      },
      notes: [],
      pluginName: '',
      text: 'Expected ")" but found "\\"$(echo \\""'
    }
  ],
  warnings: []
}

Dreamacro · 2022-08-15T02:52:38Z

Is there any workaround? I also need to import a common vite.config.ts in monorepo.

bluwy · 2022-08-15T06:17:51Z

@Dreamacro a workaround is to move the common config out from a workspace package so it doesn't have it's own node_modules. For example, moving the file to <root-monorepo>/scripts/common-config.js, and import the file via relative paths.

cutsin · 2022-08-18T10:20:29Z

@bluwy thanks for your reply, I see that now!

It doesn't make much sense for me to build it in this particular case as it's mostly various shared code being pulled in to apps that take care of the build, whatever if pulled in. Also I had couple of reusable fragments for vite.config.ts in that place as we have multiple vue apps, so wanted to share same pieces. And that's when I started to have issues with vite@>=3.0.1.

For now, I ended up extracting fragments for vite build out of package with package.json / node_modules, which works OK as expected. But if this could be fix, that would be great.

But actually its a breaking change.

edikdeisling · 2022-09-23T06:00:30Z

This issue makes really hard to use common Vite configs because usually common configs use npm packages. Hope the solution would be found.

For now, here is my workaround:
Before:

"scripts": {
    "build": "vite build",
}

After:

"scripts": {
    "build": "ts-node node_modules/vite/bin/vite.js build",
}

AkiraX2 · 2022-09-24T04:30:30Z

This issue makes really hard to use common Vite configs because usually common configs use npm packages. Hope the solution would be found.

For now, here is my workaround: Before:
"scripts": {
    "build": "vite build",
}
After:
"scripts": {
    "build": "ts-node node_modules/vite/bin/vite.js build",
}

still got Error: Cannot find module '@shared/xxxx'

any other configs needed?

edikdeisling · 2022-09-24T09:51:24Z

@maketa521 I think no. One more thing - I use pnpm. Maybe this matters. Also, my node version is v16.16.0
Here is a repo for reproducing it
https://github.com/edikdeisling/issue-vite-node-resolution

related to vitejs/vite#9202

for vitejs/vite#9202

lukashroch added the pending triage label Jul 18, 2022

lukashroch added a commit to MRC-Epid-it24/intake24 that referenced this issue Jul 19, 2022

chore: extract build fragments out of package

bc564b4

- temp workaround for vitejs/vite#9202

bluwy mentioned this issue Jul 24, 2022

vite.config.ts can't import untranspiled ts files from other packages in the same monorepo #5370

Open

7 tasks

sapphi-red mentioned this issue Aug 11, 2022

Cannot find module 'file://xxx' when vite.config.ts import absolute path #9617

Closed

7 tasks

antfu added bug pending triage p3-minor-bug An edge case that only affects very specific usage (priority) and removed pending triage labels Sep 26, 2022

antfu added a commit to vueuse/vueuse that referenced this issue Sep 26, 2022

docs: workaround vite

092798a

related to vitejs/vite#9202

antfu added a commit to vueuse/vueuse that referenced this issue Sep 26, 2022

docs: patch vite

88a17cc

for vitejs/vite#9202

This was referenced Sep 27, 2022

fix(config): resolve implicit deps as absolute path #10254

Merged

fix: do not externalize monorepo modules, revert #9140 #10321

Closed

antfu closed this as completed in #10254 Oct 3, 2022

github-actions bot locked and limited conversation to collaborators Oct 18, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Vite >=3.0.1 fails to resolve projects in monorepo #9202

Vite >=3.0.1 fails to resolve projects in monorepo #9202

lukashroch commented Jul 18, 2022 •

edited

bluwy commented Jul 19, 2022

lukashroch commented Jul 19, 2022

bluwy commented Jul 21, 2022

KubaJastrz commented Jul 26, 2022 •

edited

danielrozenberg commented Jul 29, 2022

o-alexandrov commented Jul 30, 2022

Dreamacro commented Aug 15, 2022

bluwy commented Aug 15, 2022

cutsin commented Aug 18, 2022

edikdeisling commented Sep 23, 2022

AkiraX2 commented Sep 24, 2022 •

edited

edikdeisling commented Sep 24, 2022

Vite >=3.0.1 fails to resolve projects in monorepo #9202

Vite >=3.0.1 fails to resolve projects in monorepo #9202

Comments

lukashroch commented Jul 18, 2022 • edited

Describe the bug

Reproduction

System Info

Used Package Manager

Logs

Validations

bluwy commented Jul 19, 2022

lukashroch commented Jul 19, 2022

bluwy commented Jul 21, 2022

KubaJastrz commented Jul 26, 2022 • edited

danielrozenberg commented Jul 29, 2022

o-alexandrov commented Jul 30, 2022

Dreamacro commented Aug 15, 2022

bluwy commented Aug 15, 2022

cutsin commented Aug 18, 2022

edikdeisling commented Sep 23, 2022

AkiraX2 commented Sep 24, 2022 • edited

edikdeisling commented Sep 24, 2022

lukashroch commented Jul 18, 2022 •

edited

KubaJastrz commented Jul 26, 2022 •

edited

AkiraX2 commented Sep 24, 2022 •

edited