Skip to content

refactor: migrate from Yarn 3.8.7 to pnpm#3228

Closed
misama-ct wants to merge 7 commits into
FEC-327-ai-tooling-phase-1-ui-kit-templates-install-agent-skillsfrom
ai-tooling-tryout-yarn-migration
Closed

refactor: migrate from Yarn 3.8.7 to pnpm#3228
misama-ct wants to merge 7 commits into
FEC-327-ai-tooling-phase-1-ui-kit-templates-install-agent-skillsfrom
ai-tooling-tryout-yarn-migration

Conversation

@misama-ct
Copy link
Copy Markdown
Contributor

@misama-ct misama-ct commented Apr 1, 2026

Caution

This PR was created to try out the freshly added AI Agent tooling. Do not merge without thorough review and CI validation.

Summary

  • Replace Yarn 3.8.7 with pnpm 10.11.0 as the package manager
  • Remove all Yarn artifacts (.yarnrc.yml, .yarn/, yarn.lock, constraints.pro)
  • Add pnpm equivalents (pnpm-workspace.yaml, .npmrc, pnpm-lock.yaml)
  • Update root package.json (packageManager, engines, pnpm.overrides, pnpm.onlyBuiltDependencies, scripts)
  • Migrate all shell scripts, git hooks, CI workflows, config files, and documentation from yarn to pnpm
  • Replace manypkg run/exec with native pnpm --filter / pnpm -r exec
  • Replace Yarn's Prolog-based constraints.pro with a Node.js validation script
  • Fix phantom dependency (yaml in design-system) exposed by pnpm's stricter isolation
  • Fix pre-existing incorrect deep import (@commercetools-uikit/constraints/src)
  • Regenerate all icon components with updated template comment

Known trade-offs

  • shamefully-hoist=true is enabled in .npmrc to match Yarn's flat hoisting behavior — many cross-workspace type references rely on it. Can be tightened later with targeted public-hoist-pattern[] entries.
  • pnpm.onlyBuiltDependencies allowlist may need tuning if build script warnings persist in CI.

Test plan

  • pnpm install succeeds
  • pnpm build succeeds
  • pnpm typecheck passes (0 errors)
  • pnpm test passes (1402 tests, 125 suites)
  • pnpm lint passes (1307 files)
  • node scripts/check-workspace-constraints.js passes
  • No yarn references in source files
  • CI pipeline passes
  • Changesets publish flow works
  • Percy visual regression tests pass

Review Navigator

270 files changed across 7 commits; ~25 are substantive, ~38 are README yarn addpnpm add replacements, ~17 are regenerated icon comment updates, and ~20 are AI tooling files from the base branch (not part of the migration).

Review in the logical chunks below — start with the core config (commits 1-2), then CI, then spot-check the bulk changes.

File Relationships & Review Order

flowchart TB
    subgraph "1️⃣ Core Configuration"
        A["① package.json<br/><i>packageManager, overrides, scripts</i>"]
        B["② pnpm-workspace.yaml<br/><i>workspace package globs</i>"]
        C["③ .npmrc<br/><i>shamefully-hoist=true</i>"]
        D["④ .gitignore<br/><i>remove .yarn patterns</i>"]
    end

    subgraph "2️⃣ Deleted Yarn Artifacts"
        E["⑤ .yarnrc.yml<br/><i>deleted</i>"]
        F["⑥ constraints.pro<br/><i>deleted, replaced by ⑭</i>"]
        G["⑦ .yarn/*<br/><i>deleted (plugins, releases)</i>"]
    end

    subgraph "3️⃣ Scripts & Hooks"
        H["⑧ scripts/build.sh<br/><i>yarn→pnpm, manypkg→filter</i>"]
        I["⑨ scripts/postinstall.sh<br/><i>yarn→pnpm</i>"]
        J["⑩ .husky/pre-commit<br/><i>yarn→pnpm</i>"]
        K["⑪ .husky/commit-msg<br/><i>yarn→pnpm</i>"]
    end

    subgraph "4️⃣ CI/CD Workflows"
        L["⑫ main.yml<br/><i>pnpm setup, cache, install</i>"]
        M["⑬ publish-release.yml<br/><i>pnpm setup, changeset cmds</i>"]
        N["  preview-release-on-comment.yml<br/><i>pnpm setup, snapshot cmds</i>"]
    end

    subgraph "5️⃣ Constraints Replacement"
        O["⑭ check-workspace-constraints.js<br/><i>new: replaces constraints.pro</i>"]
    end

    subgraph "6️⃣ Config Files & Workspace Packages"
        P["⑮ lint-staged.config.js<br/><i>yarn→pnpm</i>"]
        Q["⑯ jest-puppeteer.config.js<br/><i>yarn→pnpm</i>"]
        R["⑰ svgr.config.js<br/><i>template comment update</i>"]
        S["⑱ design-system/package.json<br/><i>+yaml,rcfile,prettier devDeps</i>"]
        T["⑲ storybook/package.json<br/><i>yarn→pnpm in scripts</i>"]
    end

    subgraph "7️⃣ Generators"
        U["⑳ generators/*/bin/cli.mjs<br/><i>spawnSync yarn→pnpm</i>"]
        V["㉑ generators/readme/src/index.ts<br/><i>template: yarn→pnpm</i>"]
        W["㉒ generators/readme/test/*.spec.ts<br/><i>snapshot updates</i>"]
    end

    subgraph "8️⃣ Documentation"
        X["㉓ CONTRIBUTING.md<br/><i>yarn→pnpm throughout</i>"]
        Y["㉔ test/percy/README.md<br/><i>yarn→pnpm throughout</i>"]
    end

    subgraph Bulk ["9️⃣ Bulk Changes (spot-check only)"]
        Z["~38 component READMEs<br/><i>yarn add → pnpm add</i>"]
        AA["~17 generated icons<br/><i>comment: yarn→pnpm</i>"]
    end

    subgraph "🔧 Bugfix"
        BB["㉕ dropdown-menu.stories.tsx<br/><i>fix: /constraints/src import</i>"]
    end

    A --> H
    A --> L
    A --> I
    F -.->|replaced by| O
    L --> O
    R --> AA
    V --> Z
    V -.->|tested by| W

    style O fill:#e8f5e9
    style BB fill:#fff3e0
    style Bulk fill:#f5f5f5,stroke:#bdbdbd,stroke-dasharray: 5 5
Loading

Suggested Review Order

# File What it does Link
1 package.json Root config: packageManager, engines, pnpm.overrides, pnpm.onlyBuiltDependencies, scripts (yarn workspace → pnpm --filter) View
2 pnpm-workspace.yaml New file defining workspace package globs (mirrors previous workspaces field) View
3 .npmrc New file enabling shamefully-hoist for Yarn-compatible hoisting View
4 .gitignore Removes .yarn ignore patterns, adds pnpm debug log View
5 .yarnrc.yml Deleted: Yarn config with plugins and nodeLinker View
6 constraints.pro Deleted: Yarn Prolog-based workspace constraints (replaced by #13) View
7 scripts/build.sh Replaces yarn with pnpm, manypkg run with pnpm --filter View
8 scripts/postinstall.sh Replaces yarn with pnpm for husky, manypkg, preconstruct, prettier, patch-package View
9 .husky/pre-commit yarn → pnpm for generate-package-json and lint-staged View
10 .github/workflows/main.yml Adds pnpm/action-setup, pnpm store cache, replaces all yarn commands View
11 .github/workflows/publish-release.yml Same CI migration + changeset publish/version commands View
12 .github/workflows/preview-release-on-comment.yml Same CI migration + snapshot publish commands View
13 scripts/check-workspace-constraints.js New: Node.js replacement for constraints.pro, validates license/repository/publishConfig View
14 design-system/package.json Adds yaml, rcfile, prettier as devDeps (phantom deps), updates nodemon exec View
15 lint-staged.config.js yarn prettier/lint:js → pnpm View
16 svgr.config.js Template comment: yarn generate-icons → pnpm generate-icons View
17 generators/package-json/bin/cli.mjs spawnSync('yarn') → spawnSync('pnpm') View
18 generators/readme/bin/cli.mjs spawnSync('yarn') → spawnSync('pnpm') View
19 generators/readme/src/index.ts Template strings: yarn add/generate-readme → pnpm View
20 generators/readme/test/generate-readme.spec.ts Updated inline snapshots for pnpm View
21 CONTRIBUTING.md Yarn section → pnpm, all command references updated View
22 test/percy/README.md ~59 yarn → pnpm replacements View
23 dropdown-menu.stories.tsx Bugfix: @commercetools-uikit/constraints/src@commercetools-uikit/constraints View
~38 component README.md files Bulk: yarn addpnpm add install instructions spot-check a few
~17 generated icon .tsx files Bulk: comment yarn generate-iconspnpm generate-icons spot-check a few
~20 .agents/, .claude/, AGENTS.md, CLAUDE.md files AI tooling config from base branch (not part of migration) skip

🤖 Generated with Claude Code

misama-ct and others added 7 commits April 1, 2026 14:17
Remove Yarn artifacts (.yarnrc.yml, .yarn/, yarn.lock, constraints.pro)
and set up pnpm equivalents: pnpm-workspace.yaml, .npmrc with
shamefully-hoist, and updated root package.json (packageManager,
engines, pnpm.overrides, workspace:* protocol, pnpm.onlyBuiltDependencies,
script rewrites from yarn workspace to pnpm --filter).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace yarn with pnpm in build scripts, postinstall script,
and husky git hooks (pre-commit, commit-msg).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Add pnpm/action-setup@v4 step, replace yarn cache with pnpm store,
switch install command to pnpm install --frozen-lockfile, and update
all yarn command invocations to pnpm equivalents.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Update lint-staged, jest configs, svgr template, storybook and
design-system package.json scripts to use pnpm instead of yarn.
Add yaml, rcfile, prettier as explicit devDependencies to
design-system (previously phantom deps via yarn hoisting).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace Yarn's Prolog-based constraints.pro with a Node.js script
that validates license, repository, and publishConfig fields across
all workspace packages. Used in CI and postinstall.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Update AGENTS.md, CONTRIBUTING.md, Percy README, generator templates,
generator CLI binaries (spawnSync yarn→pnpm), test snapshots, and
~70 component README install instructions (yarn add → pnpm add).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Regenerated icon components with updated svgr template comment
(pnpm generate-icons). Fix pre-existing incorrect deep import
@commercetools-uikit/constraints/src in dropdown-menu stories.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@changeset-bot
Copy link
Copy Markdown

changeset-bot Bot commented Apr 1, 2026

⚠️ No Changeset found

Latest commit: 22da04a

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@vercel
Copy link
Copy Markdown

vercel Bot commented Apr 1, 2026

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
ui-kit Error Error Apr 1, 2026 0:27am

Request Review

@misama-ct misama-ct self-assigned this Apr 1, 2026
@misama-ct misama-ct added the 🚧 Status: WIP Work in progress label Apr 1, 2026
@misama-ct misama-ct changed the base branch from main to FEC-327-ai-tooling-phase-1-ui-kit-templates-install-agent-skills April 1, 2026 13:05
Comment thread .npmrc
Comment on lines +1 to +3
# Hoist all dependencies to root node_modules (matches previous Yarn behavior).
# TODO: tighten with public-hoist-pattern[] for specific packages later.
shamefully-hoist=true
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This caught my attention and I read up on it.
When determining what would needed to be done to allow pnpm's default to prevent phantom dependencies, I encountered no errors at all.
Perhaps this file isn't even needed atm?

@@ -1,2 +1,2 @@
<!-- THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY. -->
<!-- This file is created by the `yarn generate-readme` script. -->
Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I can see that the source for this was updated here, but it's not actually generating the changes in any of the README.md files. 🤔

@misama-ct
Copy link
Copy Markdown
Contributor Author

Closing for now, we might pick it up at a later time.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

🚧 Status: WIP Work in progress

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants