Migrate from yarn to pnpm #11465

Because yarn 1 has been obsolete for a long time. Yarn 4 workflow
differs too much. pnpm offers delayed dependency update to protect
against supply chain attack. pnpm is way more popular than Yarn. And
Angular adopted pnpm themselves.

See:

- https://socket.dev/blog/pnpm-10-16-adds-new-setting-for-delayed-dependency-updates
- https://npmtrends.com/@yarnpkg/cli-vs-@yarnpkg/cli-dist-vs-pnpm-vs-yarn
- angular/angular@e7ac7f6

Author: PowerKiKi

.github/workflows/main.yml

@@ -24,9 +24,11 @@ jobs:
               with:
                   fetch-depth: 2
 
+            - uses: pnpm/action-setup@v5
             - uses: actions/setup-node@v4
               with:
                   node-version: '22'
+                  cache: 'pnpm'
 
             - uses: shivammathur/setup-php@v2
               with:
@@ -41,12 +43,6 @@ jobs:
                   key: ${{ runner.os }}-composer-${{ hashFiles('**/composer.lock') }}
                   restore-keys: ${{ runner.os }}-composer-
 
-            - uses: actions/cache@v4
-              with:
-                  path: ~/.cache/yarn
-                  key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
-                  restore-keys: ${{ runner.os }}-yarn-
-
             - name: Setup problem matchers for PHP
               run: echo "::add-matcher::${{ runner.tool_cache }}/php.json"
 
@@ -63,6 +59,6 @@ jobs:
             - run: ./vendor/bin/php-cs-fixer fix --format=checkstyle | cs2pr
             - run: ./vendor/bin/phpstan analyse
             - run: ./vendor/bin/phpunit
-            - run: yarn lint
+            - run: pnpm lint
             - run: ./node_modules/.bin/prettier --experimental-cli --check .
             - run: ./node_modules/.bin/ng test --progress false --watch=false --browsers ChromeHeadlessCustom

.prettierignore

@@ -12,6 +12,7 @@
 /htdocs/
 /logs/
 /node_modules/
+/pnpm-lock.yaml
 /server/
 /tests/
 /vendor/

README.md

@@ -46,7 +46,7 @@ $ composer clear-config-cache
 
 ### Client
 
-Run `yarn dev` for a dev server. Navigate to `http://artisans.lan:4210/`. The app will
+Run `pnpm dev` for a dev server. Navigate to `http://artisans.lan:4210/`. The app will
 automatically reload if you change any of the source files.
 
 ## Testing

angular.json

@@ -145,7 +145,7 @@
     },
     "cli": {
         "schematicCollections": ["@angular-eslint/schematics"],
-        "packageManager": "yarn",
+        "packageManager": "pnpm",
         "analytics": false
     },
     "schematics": {

bin/build.sh

@@ -67,7 +67,7 @@ echo "Installing git hooks..."
 ln -fs ../../bin/pre-commit.sh .git/hooks/pre-commit
 
 echo "Updating Node.js packages..."
-yarn install $NO_PROGRESS
+pnpm install
 
 echo "Updating all PHP dependencies via composer..."
 $COMPOSER install --classmap-authoritative $NO_PROGRESS
@@ -84,8 +84,8 @@ $PHP ./bin/delete-old-log.php
 
 if [ $IS_PRODUCTION -eq 1 ]; then
     echo "Building Angular application..."
-    yarn run prod
+    pnpm run prod
 else
     echo "Running Angular dev server..."
-    yarn run dev
+    pnpm run dev
 fi

bin/test-nginx-rules.php

@@ -13,11 +13,11 @@ function run(string $cmd): string
     return shell_exec($cmd);
 }
 
-function test(string $url): void
-{
-    $pattern = '<img src="assets/logo-artisans-de-la-transition.svg"';
-    $message = 'logged in user should get raw Angular';
-
+function test(
+    string $url,
+    string $pattern = '<img class="boot-logo" src="assets/logo-artisans-de-la-transition.svg"',
+    string $message = 'should get raw Angular',
+): void {
     // Assert HTTP status code
     $status = run("curl --insecure --silent --output /dev/null --write-out '%{http_code}' '$url'");
     if ($status !== '200') {
@@ -40,6 +40,6 @@ function test(string $url): void
 test('https://artisans.lan');
 test('https://artisans.lan/larevuedurable/numeros');
 test('https://artisans.lan/mon-compte');
-test('https://artisans.lan/sitemap.xml');
+test('https://artisans.lan/sitemap.xml', '<loc>https://artisans.lan/association/nos-convictions</loc>', 'should get sitemap');
 
 echo '❤️  All tests OK' . PHP_EOL;

package.json

@@ -6,14 +6,15 @@
         "ng": "ng",
         "postinstall": "playwright install chromium",
         "client-config": "`which php8.4 || which php` ./bin/generate-client-configuration.php",
-        "prerequisite": "mkdir -p htdocs/ && cp -v server/index.php htdocs/ && yarn client-config && yarn codegen",
-        "dev": "yarn prerequisite && ng serve",
-        "prod": "yarn prerequisite && ng build && find data/tmp/build/browser -type f -not -name '*.gz' -exec gzip --keep --best {} \\; && rm -rf htdocs/ && mv -v data/tmp/build/browser htdocs",
-        "test": "yarn prerequisite && ng test",
+        "prerequisite": "mkdir -p htdocs/ && cp -v server/index.php htdocs/ && pnpm client-config && pnpm codegen",
+        "dev": "pnpm prerequisite && ng serve",
+        "prod": "pnpm prerequisite && ng build && find data/tmp/build/browser -type f -not -name '*.gz' -exec gzip --keep --best {} \\; && rm -rf htdocs/ && mv -v data/tmp/build/browser htdocs",
+        "test": "pnpm prerequisite && ng test",
         "lint": "ng lint --max-warnings 0",
         "e2e": "playwright test",
         "codegen": "./bin/dump-schema && graphql-codegen --config codegen.ts"
     },
+    "packageManager": "pnpm@10.33.0",
     "dependencies": {
         "@angular/cdk": "^21.2.0",
         "@angular/common": "^21.2.0",