Migrate to pnpm (#11358)

Author: markdalgleish

.changeset/config.json

@@ -17,5 +17,6 @@
   "access": "public",
   "baseBranch": "dev",
   "updateInternalDependencies": "patch",
+  "bumpVersionsWithWorkspaceProtocolOnly": true,
   "ignore": []
 }

.eslintignore

@@ -1,5 +1,6 @@
 /fixtures/
 node_modules/
+pnpm-lock.yaml
 /docs/api
 examples/**/dist/
 packages/**/dist/

.github/workflows/deduplicate-yarn.yml .github/workflows/deduplicate-lock-file.yml

@@ -1,11 +1,11 @@
-name: ⚙️ Deduplicate yarn.lock
+name: ⚙️ Deduplicate lock file
 
 on:
   push:
     branches:
       - dev
     paths:
-      - ./yarn.lock
+      - ./pnpm-lock.yaml
 
 concurrency:
   group: ${{ github.workflow }}-${{ github.ref }}
@@ -20,14 +20,17 @@ jobs:
       - name: ⬇️ Checkout repo
         uses: actions/checkout@v4
 
+      - name: 📦 Setup pnpm
+        uses: pnpm/[email protected]
+
       - name: ⎔ Setup node
         uses: actions/setup-node@v4
         with:
           node-version-file: ".nvmrc"
-          cache: "yarn"
+          cache: "pnpm"
 
-      - name: ⚙️ Dedupe yarn.lock
-        run: npx yarn-deduplicate && rm -rf ./node_modules && yarn
+      - name: ⚙️ Dedupe lock file
+        run: pnpm dedupe && rm -rf ./node_modules && pnpm install
 
       - name: 💪 Commit
         run: |
@@ -38,6 +41,6 @@ jobs:
             echo "💿 no deduplication needed"
             exit 0
           fi
-          git commit -m "chore: deduplicate `yarn.lock`"
+          git commit -m "chore: deduplicate `pnpm-lock.yaml`"
           git push
           echo "💿 https://github.com/$GITHUB_REPOSITORY/commit/$(git rev-parse HEAD)"

.github/workflows/format.yml

@@ -21,20 +21,23 @@ jobs:
         with:
           token: ${{ secrets.FORMAT_PAT }}
 
+      - name: 📦 Setup pnpm
+        uses: pnpm/[email protected]
+
       - name: ⎔ Setup node
         uses: actions/setup-node@v4
         with:
-          cache: yarn
+          cache: pnpm
           node-version-file: ".nvmrc"
 
       - name: 📥 Install deps
-        run: yarn --frozen-lockfile
+        run: pnpm install --frozen-lockfile
 
       - name: 🔃 Sort contributors.yml
         run: sort --ignore-case --output contributors.yml contributors.yml
 
       - name: 👔 Format
-        run: yarn format
+        run: pnpm format
 
       - name: 💪 Commit
         run: |

.github/workflows/release-experimental.yml

@@ -22,22 +22,25 @@ jobs:
         with:
           fetch-depth: 0
 
+      - name: 📦 Setup pnpm
+        uses: pnpm/[email protected]
+
       - name: ⎔ Setup node
         uses: actions/setup-node@v4
         with:
-          cache: yarn
+          cache: pnpm
           node-version-file: ".nvmrc"
 
       - name: 📥 Install deps
-        run: yarn --frozen-lockfile
+        run: pnpm install --frozen-lockfile
 
       - name: 🏗 Build
-        run: yarn build
+        run: pnpm build
 
       - name: 🔐 Setup npm auth
         run: |
           echo "registry=https://registry.npmjs.org" >> ~/.npmrc
           echo "//registry.npmjs.org/:_authToken=${{ secrets.NPM_TOKEN }}" >> ~/.npmrc
 
       - name: 🚀 Publish
-        run: npm run publish
+        run: pnpm run publish

.github/workflows/release.yml

@@ -27,14 +27,17 @@ jobs:
         with:
           fetch-depth: 0
 
+      - name: 📦 Setup pnpm
+        uses: pnpm/[email protected]
+
       - name: ⎔ Setup node
         uses: actions/setup-node@v4
         with:
           node-version-file: ".nvmrc"
-          cache: "yarn"
+          cache: "pnpm"
 
       - name: 📥 Install deps
-        run: yarn --frozen-lockfile
+        run: pnpm install --frozen-lockfile
 
       - name: 🔐 Setup npm auth
         run: |
@@ -50,10 +53,10 @@ jobs:
         id: changesets
         uses: changesets/action@v1
         with:
-          version: yarn run version
+          version: pnpm run version
           commit: "chore: Update version for release"
           title: "chore: Update version for release"
-          publish: yarn run release
+          publish: pnpm run release
           createGithubReleases: false
         env:
           GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
@@ -70,11 +73,14 @@ jobs:
       - name: ⬇️ Checkout repo
         uses: actions/checkout@v4
 
+      - name: 📦 Setup pnpm
+        uses: pnpm/[email protected]
+
       - name: ⎔ Setup node
         uses: actions/setup-node@v4
         with:
           node-version: 16
-          cache: "npm"
+          cache: "pnpm"
 
       - id: find_package_version
         run: |

.github/workflows/test.yml

@@ -35,10 +35,13 @@ jobs:
       - name: ⬇️ Checkout repo
         uses: actions/checkout@v4
 
+      - name: 📦 Setup pnpm
+        uses: pnpm/[email protected]
+
       - name: ⎔ Setup node
         uses: actions/setup-node@v4
         with:
-          cache: yarn
+          cache: pnpm
           check-latest: true
           node-version: ${{ matrix.node }}
 
@@ -49,16 +52,16 @@ jobs:
           echo "::remove-matcher owner=eslint-stylish::"
 
       - name: 📥 Install deps
-        run: yarn --frozen-lockfile
+        run: pnpm install --frozen-lockfile
 
       - name: 🏗 Build
-        run: yarn build
+        run: pnpm build
 
       - name: 🔬 Lint
-        run: yarn lint
+        run: pnpm lint
 
       - name: 🧪 Run tests
-        run: yarn test
+        run: pnpm test
 
       - name: Check bundle size
-        run: yarn size
+        run: pnpm size

.gitignore

@@ -6,6 +6,7 @@ npm-debug.log
 node_modules/
 
 /examples/*/yarn.lock
+/examples/*/pnpm-lock.yaml
 /examples/*/dist
 /tutorial/dist
 

.npmrc

@@ -0,0 +1,2 @@
+ignore-workspace-cycles=true
+enable-pre-post-scripts=true

DEVELOPMENT.md

@@ -16,7 +16,7 @@ Changesets will do most of the heavy lifting for our releases. When changes are
 ### Starting a new pre-release
 
 - Ensure you are on the new `release-*` branch.
-- Enter Changesets pre-release mode using the `pre` tag: `yarn changeset pre enter pre`.
+- Enter Changesets pre-release mode using the `pre` tag: `pnpm changeset pre enter pre`.
 - Commit the change and push the `release-*` branch to GitHub.
 - Wait for the release workflow to finish. The Changesets action in the workflow will open a PR that will increment all versions and generate the changelogs.
 - Review the updated `CHANGELOG` files and make any adjustments necessary, then merge the PR into the `release-*` branch.
@@ -32,7 +32,7 @@ Changesets will do most of the heavy lifting for our releases. When changes are
 You may need to make changes to a pre-release prior to publishing a final stable release. To do so:
 
 - Make whatever changes you need.
-- Create a new changeset: `yarn changeset`.
+- Create a new changeset: `pnpm changeset`.
   - **IMPORTANT:** This is required even if you ultimately don't want to include these changes in the logs. Remember, changelogs can be edited prior to publishing, but the Changeset version script needs to see new changesets in order to create a new version.
 - Commit the changesets and push the `release-*` branch to GitHub.
 - Wait for the release workflow to finish and the Changesets action to open its PR that will increment all versions.
@@ -42,7 +42,7 @@ You may need to make changes to a pre-release prior to publishing a final stable
 
 ### Publishing the stable release
 
-- Exit Changesets pre-release mode: `yarn changeset pre exit`.
+- Exit Changesets pre-release mode: `pnpm changeset pre exit`.
 - Commit the edited pre-release file along with any unpublished changesets, and push the `release-*` branch to GitHub.
 - Wait for the release workflow to finish. The Changesets action in the workflow will open a PR that will increment all versions and generate the changelogs for the stable release.
 - Review the updated `CHANGELOG` files and make any adjustments necessary.
@@ -71,6 +71,6 @@ Experimental releases and hot-fixes do not need to be branched off of `dev`. Exp
 
 - Create a new branch for the release: `git checkout -b release-experimental`
 - Make whatever changes you need and commit them: `git add . && git commit "experimental changes!"`
-- Update version numbers and create a release tag: `yarn run version:experimental`
+- Update version numbers and create a release tag: `pnpm run version:experimental`
 - Push to GitHub: `git push origin --follow-tags`
 - The CI workflow should automatically trigger from the experimental tag to publish the release to npm

docs/guides/contributing.md

@@ -30,7 +30,7 @@ cd react-router
 git checkout dev
 ```
 
-3. Install dependencies and build. React Router uses [`yarn` (version 1)](https://classic.yarnpkg.com/lang/en/docs/install), so you should too. If you install using `npm`, unnecessary `package-lock.json` files will be generated.
+3. Install dependencies and build. React Router uses [pnpm](https://pnpm.io), so you should too. If you install using `npm`, unnecessary `package-lock.json` files will be generated.
 
 ## Think You Found a Bug?
 
@@ -72,22 +72,22 @@ All commits that change or add to the API must be done in a pull request that al
 
 React Router uses a monorepo to host code for multiple packages. These packages live in the `packages` directory.
 
-We use [Yarn workspaces](https://classic.yarnpkg.com/en/docs/workspaces/) to manage installation of dependencies and running various scripts. To get everything installed, make sure you have [Yarn (version 1) installed](https://classic.yarnpkg.com/lang/en/docs/install), and then run `yarn` or `yarn install` from the repo root.
+We use [pnpm workspaces](https://pnpm.io/workspaces/) to manage installation of dependencies and running various scripts. To get everything installed, make sure you have [pnpm installed](https://pnpm.io/installation), and then run `pnpm install` from the repo root.
 
 ### Building
 
-Calling `yarn build` from the root directory will run the build, which should take only a few seconds. It's important to build all the packages together because `react-router-dom` and `react-router-native` both use `react-router` as a dependency.
+Calling `pnpm build` from the root directory will run the build, which should take only a few seconds. It's important to build all the packages together because `react-router-dom` and `react-router-native` both use `react-router` as a dependency.
 
 ### Testing
 
-Before running the tests, you need to run a build. After you build, running `yarn test` from the root directory will run **every** package's tests. If you want to run tests for a specific package, use `yarn test --projects packages/<package-name>`:
+Before running the tests, you need to run a build. After you build, running `pnpm test` from the root directory will run **every** package's tests. If you want to run tests for a specific package, use `pnpm test --projects packages/<package-name>`:
 
 ```bash
 # Test all packages
-yarn test
+pnpm test
 
 # Test only react-router-dom
-yarn test --projects packages/react-router-dom
+pnpm test --projects packages/react-router-dom
 ```
 
 ## Repository Branching
@@ -111,7 +111,7 @@ When it's time to cut a new release, we follow a process based on our branching
 We create experimental releases from the current state of the `dev` branch. They can be installed by using the `@next` tag:
 
 ```bash
-yarn add react-router-dom@next
+pnpm add react-router-dom@next
 # or
 npm install react-router-dom@next
 ```
@@ -133,7 +133,7 @@ git checkout -b release/v6.1.0
 
 # Create a new tag and update version references throughout the
 # codebase.
-yarn run version minor # | "patch" | "major"
+pnpm run version minor # | "patch" | "major"
 
 # Push the release branch along with the new release tag.
 git push origin release/v6.1.0 --follow-tags
@@ -160,11 +160,11 @@ Sometimes we have a crucial bug that needs to be patched right away. If the bug
 ```bash
 # From the main branch, make sure to run the build and all tests
 # before creating a new release.
-yarn && yarn build && yarn test
+pnpm install && pnpm build && pnpm test
 
 # Assuming the tests pass, create the release tag and update
 # version references throughout the codebase.
-yarn run version patch
+pnpm run version patch
 
 # Push changes along with the new release tag.
 git push origin main --follow-tags

package.json

@@ -1,31 +1,20 @@
 {
   "name": "@remix-run/react-router",
   "private": true,
-  "workspaces": {
-    "packages": [
-      "packages/react-router",
-      "packages/react-router-dom",
-      "packages/react-router-dom-v5-compat",
-      "packages/react-router-native",
-      "packages/router"
-    ]
-  },
   "scripts": {
     "build": "rollup -c",
     "clean": "git clean -fdX .",
     "format": "prettier --ignore-path .eslintignore --write .",
     "format:check": "prettier --ignore-path .eslintignore --check .",
-    "postinstall": "patch-package",
     "lint": "eslint --cache .",
-    "prerelease": "yarn build",
+    "prerelease": "pnpm build",
     "release": "changeset publish",
     "size": "filesize",
     "test": "jest",
     "test:inspect": "node --inspect-brk ./node_modules/.bin/jest",
     "changeset": "changeset",
     "version": "changeset version && node ./scripts/remove-prerelease-changelogs.mjs",
     "publish": "node scripts/publish.js",
-    "postversion": "node scripts/postversion.mjs",
     "version:experimental": "node ./scripts/version experimental",
     "watch": "rollup -c -w"
   },
@@ -37,6 +26,7 @@
       "default"
     ]
   },
+  "packageManager": "[email protected]",
   "resolutions": {
     "@types/react": "^18.2.18",
     "@types/react-dom": "^18.2.7",
@@ -91,7 +81,6 @@
     "jest": "^29.6.2",
     "jest-environment-jsdom": "^29.6.2",
     "jsonfile": "^6.1.0",
-    "patch-package": "^6.5.1",
     "prettier": "^2.8.8",
     "prompt-confirm": "^2.0.4",
     "react": "^18.2.0",
@@ -130,5 +119,10 @@
     "packages/react-router-dom/dist/umd/react-router-dom.production.min.js": {
       "none": "23.5 kB"
     }
+  },
+  "pnpm": {
+    "patchedDependencies": {
+      "@changesets/[email protected]": "patches/@[email protected]"
+    }
   }
 }

packages/react-router-dom-v5-compat/package.json

@@ -23,8 +23,9 @@
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "dependencies": {
+    "@remix-run/router": "workspace:*",
     "history": "^5.3.0",
-    "react-router": "6.22.3"
+    "react-router": "workspace:*"
   },
   "peerDependencies": {
     "react": ">=16.8",