sveltejs
svelte-kit caching with yarn PNP
Describe the bug
Overview
Previously there was some discussion over the use of yarn PNP / berry here
- https://github.com/sveltejs/kit/issues/993
The main advantage of PNP is that it allows you to reference packages from a global cache on the disk (similar to pnpm except without the disk hard links). So it saves on disk space with the global cache setting enabled.
With yarn 3.2.1 PNP this sort of half works. If you install and set everything up then it works fine on the first run, but then fails on the follow up run due to something related to the .svelte-kit caching
Reproduction
Example
First setup a new svelte kit app (skeleton)
yarn create svelte myapp
cd myapp
Switch to yarn berry with PNP
yarn set version berry
Add the following to the config under the kit section of svelte.config.js
kit: {
vite: {server: {fs: {allow: ['.yarn']}}},
}
Try yarn dev
yarn dev
At this point things work on the first run On follow up runs this error shows up
> p.replace is not a function
at Object.toPortablePath (C:\SourceCode\project-docs\example\.pnp.cjs:2808:9)
at PosixFS.mapToBase (C:\SourceCode\project-docs\example\.pnp.cjs:5313:18)
at PosixFS.rmdirSync (C:\SourceCode\project-docs\example\.pnp.cjs:5230:39)
at URLFS.rmdirSync (C:\SourceCode\project-docs\example\.pnp.cjs:5230:24)
at _rmdirSync (node:internal/fs/rimraf:260:21)
at rimrafSync (node:internal/fs/rimraf:193:7)
at node:internal/fs/rimraf:253:9
at Array.forEach (<anonymous>)
at _rmdirSync (node:internal/fs/rimraf:250:7)
at rimrafSync (node:internal/fs/rimraf:193:7)
If I delete the .svelte-kit directory then it works fine again for a first run.
Logs
No response
System Info
System:
OS: Windows 10 10.0.19044
CPU: (16) x64 11th Gen Intel(R) Core(TM) i7-11800H @ 2.30GHz
Memory: 5.34 GB / 15.68 GB
Binaries:
Node: 18.1.0 - C:\Program Files\nodejs\node.EXE
Yarn: 3.2.1 - ~\AppData\Roaming\npm\yarn.CMD
npm: 8.11.0 - C:\Program Files\nodejs\npm.CMD
Browsers:
Edge: Spartan (44.19041.1266.0), Chromium (103.0.1264.44)
Internet Explorer: 11.0.19041.1566
Severity
annoyance
Additional Information
No response
Just to add the quick way to turn PNP off
.yarnrc.yml
nodeLinker: node-modules
This gets around the above but means more disk space used
Not sure if they are plans to support this per https://kit.svelte.dev/faq#integrations-how-do-i-use-with-yarn-how-do-i-use-with-yarn-3
I wrote that (the yarn 3 part) I figured I'd raise this issue as I suspect the problem with pnp might be with the way the caching works inside the .svelte-kit directory which might be a svelte-kit issue.
One thing that could be done to make things better is to add the .yarn directory into the defaults passed to vite
kit: {
vite: {server: {fs: {allow: ['.yarn']}}},
}
Oh sorry I didn't know that 😅 I'm not sure how yarn pnp affects .svelte-kit caching, but it seems like yarn is doing something off. Does specifying .yarn in server.fs.allow fixes it?
It doesn't fix the .svelte-kit caching issue (I'm not sure how to fix that outside of just deleting the cache directory each time before running) but it does fix a warning vite shows up when you try to run things this way
Awhile back I was trying to get sveltekit to work with yarn berry but ran into the same issue. I believe this PR will fix it on yarn's side: https://github.com/yarnpkg/berry/pull/3889.
The third issue mentioned in that PR (3783) looks like a very similar error we are getting here, but I could be wrong.
is there anything kit can/should do here? Looks like yarn pnp still has issues to solve on their end.
The fs.allow setting can be provided by pnp users in config. Automatic detection would be something either for vite or a supporting vite-plugin-yarn-pnp.
Using yarn 3.2.2 which included the pr I had mentioned above the issue still persists.
I think this has been fixed in a more recent version of yarn. I have been able to successfully use sveltekit with the current version of yarn (4.1.1).
There is an issue with the use of prettier and plugins (which shows up in sveltekit), I was able to patch that in prettier though. See https://github.com/wooorm/import-meta-resolve/issues/26 and https://github.com/prettier/prettier/issues/15513.
Still reproduced in yarn 4.4.0 with next error
error when starting dev server:
Error: Could not resolve peer dependency "@sveltejs/vite-plugin-svelte" relative to your project — please install it and try again.
at resolve_peer_dependency (file:///home/sunrabbit/Desktop/myapp/.yarn/unplugged/@sveltejs-kit-virtual-60ca7c2c65/node_modules/@sveltejs/kit/src/utils/import.js:15:9)
at sveltekit (file:///home/sunrabbit/Desktop/myapp/.yarn/unplugged/@sveltejs-kit-virtual-60ca7c2c65/node_modules/@sveltejs/kit/src/exports/vite/index.js:155:27)
at async Promise.all (index 0)
at async asyncFlatten (file:///home/sunrabbit/Desktop/myapp/.yarn/virtual/vite-virtual-204348ee17/3/.yarn/berry/cache/vite-npm-5.4.0-6fbda5653e-10c0.zip/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:17506:12)
at async resolveConfig (file:///home/sunrabbit/Desktop/myapp/.yarn/virtual/vite-virtual-204348ee17/3/.yarn/berry/cache/vite-npm-5.4.0-6fbda5653e-10c0.zip/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:66040:27)
at async _createServer (file:///home/sunrabbit/Desktop/myapp/.yarn/virtual/vite-virtual-204348ee17/3/.yarn/berry/cache/vite-npm-5.4.0-6fbda5653e-10c0.zip/node_modules/vite/dist/node/chunks/dep-NjL7WTE1.js:62627:18)
at async CAC.
