Vite is unable to resolve nested dependency in optimizeDeps.include

[merceyz]

Describe the bug

Vite is unable to resolve nested dependencies of scoped dependencies specified in optimizeDeps.include.

When testing the reproduction with Yarn PnP the logs from PNP_DEBUG_LEVEL=1 makes it seem like there is an extra path.dirname somewhere.

$ PNP_DEBUG_LEVEL=1 corepack yarn vite optimize --force

✖ Your application tried to access semver, but it isn't declared in your dependencies; this makes the require call ambiguous and unsound.

  In ← 'semver'
  In ← '/tmp/tmp.EqUBrhPYB7/vanilla/.yarn/cache/@babel-core-npm-7.21.8-236525e651-f281184473.zip/node_modules/@babel'
  In ← { considerBuiltins: false }

  at resolvePackageData (file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:11565:29)
  at tryNodeResolve (file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:23089:17)
  at Context.resolveId (file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:22874:28)
  at Object.resolveId (file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:42847:46)
  at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
  at async file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:64148:21
  at async file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:44542:16
  at async addManuallyIncludedOptimizeDeps (file:///tmp/tmp.EqUBrhPYB7/vanilla/.yarn/__virtual__/vite-virtual-55cf10592a/0/cache/vite-npm-4.3.8-6b9e975795-454a7c0c1b.zip/node_modules/vite/dist/node/chunks/dep-4d3eff22.js:44506:31)

Reproduction

https:/merceyz/vite-pnp-optimize-deps-include-bug/tree/node-modules-reproduction

Steps to reproduce

corepack yarn
corepack yarn vite optimize --force

System Info

System:
  OS: Linux 5.15 Ubuntu 22.04.2 LTS 22.04.2 LTS (Jammy Jellyfish)
  CPU: (16) x64 AMD Ryzen 7 3700X 8-Core Processor
  Memory: 20.83 GB / 23.44 GB
  Container: Yes
  Shell: 3.6.1 - /usr/bin/fish
Binaries:
  Node: 20.2.0 - /tmp/xfs-5a46f110/node
  Yarn: 3.5.1 - /tmp/xfs-5a46f110/yarn

Used Package Manager

yarn

Logs

No response

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.

[bluwy]

I can't seem to link Vite in yarn pnp without hiding the original error, so this is pretty tough to debug. IIUC the issue is that the /tmp/tmp.EqUBrhPYB7/vanilla/.yarn/cache/postcss-npm-8.4.23-d4a02a832d-8bb9d1b2ea.zip/node_modules should end with /postcss instead.

We're resolving the nested specifiers here:

vite/packages/vite/src/node/optimizer/index.ts

Lines 902 to 912 in e3db771

	function nestedResolveBasedir(
	id: string,
	basedir: string,
	preserveSymlinks = false,
	) {
	const pkgs = id.split('>').map((pkg) => pkg.trim())
	for (const pkg of pkgs) {
	basedir = resolvePackageData(pkg, basedir, preserveSymlinks)?.dir || basedir
	}
	return basedir
	}

The ?.dir comes from

vite/packages/vite/src/node/packages.ts

Line 168 in e3db771

const pkgDir = path.dirname(pkgPath)

However, the pkgPath will always have a package.json:

vite/packages/vite/src/node/packages.ts

Line 67 in e3db771

const pkgData = loadPackageData(path.join(pkg, 'package.json'))

So I'm not sure how it's happening. In the repro, I also made a test if you want to try the flow:

// test.cjs - run with `yarn node test.cjs`

const pnp = require('pnpapi')
const path = require('path')

let a = pnp.resolveToUnqualified('vite', process.cwd(), {
  considerBuiltins: false,
})
a = path.dirname(path.join(a, 'package.json'))
console.log('vite', a)

let b = pnp.resolveToUnqualified('postcss', a, {
  considerBuiltins: false,
})
b = path.dirname(path.join(b, 'package.json'))
console.log('postcss', b)

let c = pnp.resolveToUnqualified('nanoid', b, {
  considerBuiltins: false,
})
c = path.dirname(path.join(c, 'package.json'))
console.log('nanoid', c)

[merceyz]

Correct, I've updated the reproduction to use postcss > nanoid instead to avoid going through the dependency chain of Vite.

The /postcss is removed here

vite/packages/vite/src/node/plugins/resolve.ts

Line 703 in eeb0617

basedir = path.dirname(importer)

importer is /tmp/tmp.EqUBrhPYB7/vanilla/.yarn/cache/postcss-npm-8.4.23-d4a02a832d-8bb9d1b2ea.zip/node_modules/postcss at that point.

I would assume the issue is here

vite/packages/vite/src/node/optimizer/index.ts

Line 895 in bd86375

return await resolve(nestedPath, basedir, undefined, ssr)

as it seems like resolve expects a file path but it's passed a directory.

[merceyz]

I was able to reproduce with node_modules when using a scoped dependency so this is unrelated to PnP, see https:/merceyz/vite-pnp-optimize-deps-include-bug/tree/node-modules-reproduction for a updated reproduction.