diff --git a/documentation/faq/80-integrations.md b/documentation/faq/80-integrations.md index 9428e482f32f..e169790a200d 100644 --- a/documentation/faq/80-integrations.md +++ b/documentation/faq/80-integrations.md @@ -103,6 +103,34 @@ onMount(() => { }); ``` -### Does it work with Yarn 2? +### How do I use with Yarn? + +#### Does it work with Yarn 2? Sort of. The Plug'n'Play feature, aka 'pnp', is broken (it deviates from the Node module resolution algorithm, and [doesn't yet work with native JavaScript modules](https://github.com/yarnpkg/berry/issues/638) which SvelteKit — along with an [increasing number of packages](https://blog.sindresorhus.com/get-ready-for-esm-aa53530b3f77) — uses). You can use `nodeLinker: 'node-modules'` in your [`.yarnrc.yml`](https://yarnpkg.com/configuration/yarnrc#nodeLinker) file to disable pnp, but it's probably easier to just use npm or [pnpm](https://pnpm.io/), which is similarly fast and efficient but without the compatibility headaches. + +#### How do I use with Yarn 3? + +Currently ESM Support within the latest Yarn (version 3) is considered [experimental](https://github.com/yarnpkg/berry/pull/2161). + +The below seems to work although your results may vary. + +First create a new application: +```sh +yarn create svelte myapp +cd myapp +``` + +And enable Yarn Berry: +```sh +yarn set version berry +yarn install +``` + +**Yarn 3 global cache** + +One of the more interesting features of Yarn Berry is the ability to have a single global cache for packages, instead of having multiple copies for each project on the disk. However, setting `enableGlobalCache` to true causes building to fail, so it is recommended to add the following to the `.yarnrc.yml` file: +``` +nodeLinker: node-modules +``` +This will cause packages to be downloaded into a local node_modules directory but avoids the above problem and is your best bet for using version 3 of Yarn at this point in time.