TR kizaki Tech Memo

Hope to work together with yarn v3.2.0 => updated v3.5.0

今回はSome optional features are available via external plugins: Switching to Plug'n'Playもtryしたい

  • この設定だと下のproject directryは完全にこのyarn@3.2.0に依存するから常にupdateが必要不可欠 親のpackage.json、yarn.lockに依存するため

ref:yarn-v1-to-v3

まず、現在の yarn v1.22.x から直接 v3 へアップグレードする機能がなく、一旦 berry というコードネームの実質 v2 を経由します。もうややこしいですね。

ここからは環境依存なのですが、 v2 以降では、親ディレクトリのいずれかに package.json があると、そこを workspace の親として認識しようとして、親に管理されていない子 package.json では yarn install が失敗します。自分は巨大なリポジトリの一部でこれをやろうとしてハマりました。

yarn.lock があるディレクトリで、 yarn set version 3.0.0 をすると、.yarn/releases/yarn-3.0.0.cjs に yarn v3 の実体が生成されます。これがないと yarn コマンドの実行に失敗するので、 git にコミットしておく必要があります。

また、 .yarnrc.yml もコミットします。

ref:yarn-3-0-performances-esbuild-better-patches-e07

ref: migration#step-by-step

ref:737443905ecda1

  • まずはberry(v2)から最新版v3.2.0にset

~ git:(main) ✗ yarn set version berry
➤ YN0000: Retrieving https://repo.yarnpkg.com/3.2.0/packages/yarnpkg-cli/bin/yarn.js
➤ YN0000: Saving the new release in .yarn/releases/yarn-3.2.0.cjs
➤ YN0000: Done in 1s 238ms

➜  ~ git:(main) ✗ yarn set version 3.2.0
➤ YN0000: Retrieving https://repo.yarnpkg.com/3.2.0/packages/yarnpkg-cli/bin/yarn.js
➤ YN0000: Saving the new release in .yarn/releases/yarn-3.2.0.cjs
➤ YN0000: Done in 1s 186ms

  • .yarnrc.ymlの修正!

    ref:yarnrc


https://yarnpkg.com/getting-started/qa#which-files-should-be-gitignored
git:(main) ✗ open .yarnrc.yml
plugins:

- path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
spec: "@yarnpkg/plugin-interactive-tools"
- path: .yarn/plugins/@yarnpkg/plugin-production-install.cjs
spec: "https://gitlab.com/Larry1123/yarn-contrib/-/raw/master/packages/plugin-production-install/bundles/@yarnpkg/plugin-production-install.js"

yarnPath: .yarn/releases/yarn-3.2.0.cjs
defaultSemverRangePrefix: ""
nodeLinker: "node-modules"
  • インストール

➜  ~ git:(main) ✗ yarn install
➤ YN0000: ┌ Resolution step
➤ YN0000: └ Completed
➤ YN0000: ┌ Fetch step
➤ YN0000: └ Completed
➤ YN0000: ┌ Link step
➤ YN0000: └ Completed
➤ YN0000: Done in 0s 65ms
  • インストール成功！

➜  ~ git:(main) ✗ yarn -v
3.2.0
  • .gitignore設定

yarn install すると .yarn/cache に node_modules の実体の zip が保存されます。これをコミットするのがゼロインストールモードで、 yarn install が不要になります。ただ、これをやると前述のように git blob objects が爆発するので避けます。 たしかにゼロインストールで便利なところもあって、 docker に転送する際に docker 内で yarn install をする必要がない、という点です。このためだけに 一時的に .gitignore を書き換えるスクリプトを用意するのもありかもしれないと考えてますが、まだ検証してません。

~ git:(main) ✗ cd .gitignore
➜  .gitignore git:(main) ✗ touch .gitignore
➜  .gitignore git:(main) ✗ vi .gitignore

yarn

.yarn/* !.yarn/patches !.yarn/plugins !.yarn/releases !.yarn/sdks !.yarn/versions

  • yarnにpluginを追加してみる。まずはinteractive-toolから。
~ git:(main) ✗ yarn plugin import interactive-tools
➤ YN0000: Downloading https://github.com/yarnpkg/berry/raw/@yarnpkg/cli/3.2.0/packages/plugin-interactive-tools/bin/%40yarnpkg/plugin-interactive-tools.js
➤ YN0000: Saving the new plugin in .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
➤ YN0000: Done in 1s 658ms
  • 他のofficial plugin list

➜  ~ git:(main) ✗ yarn plugin list
➤ YN0000: @yarnpkg/plugin-hello-world [experimental]
➤ YN0000: @yarnpkg/plugin-constraints [experimental]
➤ YN0000: @yarnpkg/plugin-exec [experimental]
➤ YN0000: @yarnpkg/plugin-interactive-tools [experimental]
➤ YN0000: @yarnpkg/plugin-stage [experimental]
➤ YN0000: @yarnpkg/plugin-typescript [experimental]
➤ YN0000: @yarnpkg/plugin-version [experimental]
➤ YN0000: @yarnpkg/plugin-workspace-tools [experimental]
➤ YN0000: Done in 0s 294ms
  • typescriptのpluginも追加

~ git:(main) ✗ yarn plugin import typescript
➤ YN0000: Downloading https://github.com/yarnpkg/berry/raw/@yarnpkg/cli/3.2.0/packages/plugin-typescript/bin/%40yarnpkg/plugin-typescript.js
➤ YN0000: Saving the new plugin in .yarn/plugins/@yarnpkg/plugin-typescript.cjs
➤ YN0000: Done in 1s 274ms
  • about Switching to Plug'n'Play

This step is completely optional - while we recommend to use Plug'n'Play for most new projects, it may sometimes require an average time investment to enable it on existing projects. For this reason, we prefer to list it here as a separate step that you can look into if you're curious or simply want the absolute best of what Yarn has to offer.

← Back to home