chore: use pnpm for builds (#19752)

* Migrate from npm to pnpm across entire project

• Update all GitHub workflow files to use pnpm instead of npm
• Replace npm commands with pnpm equivalents in devcontainer scripts
• Remove package-lock.json files and update to use pnpm-lock.yaml
• Consolidate node version references to use server/.nvmrc

* Refine pnpm migration based on review feedback

• Replace SKIP_SHARP_FILTERING with SHARP_IGNORE_GLOBAL_LIBVIPS environment variable
• Improve Sharp package filtering to include specific Linux architectures for Docker builds
• Optimize Dockerfile dependency caching with improved layer structure
• Clean up workspace configuration and remove redundant settings

* Address additional review feedback for pnpm migration

• Fix node-version-file paths in GitHub workflow configurations
• Refactor .pnpmfile.cjs to use switch statement for better code organization
• Correct cache type typo in fix-format workflow
• Simplify Vite configuration by merging configs inline
• Update package description for consistency

* Use 'server/.nvmrc' for fix-format.yml GHA

* Delete npm locks

* Remove Docker volume isolation for node_modules directories

• Remove volume mounts for node_modules and related directories
• Allow shared access between host and container filesystem
• Update init container to handle file ownership with conditional existence check

* Remove unused Docker volumes and volume mounts

• Remove node_modules volume mounts from devcontainer configuration
• Remove unused named volumes for pnpm-store, node_modules, and cache directories
• Clean up Docker Compose configuration after removing volume isolation

* Fix typescript-sdk package issues

• Remove unknown "build" dependency that was incorrectly added to package.json
• Update pnpm-lock.yaml to reflect dependency removal

* Add pnpm setup to mobile workflow for translation formatting

• Add pnpm action setup step to mobile unit tests workflow
• Required for translation file formatting and sorting operations

---------

Co-authored-by: Jason Rasmussen <jason@rasm.me>

web/Dockerfile

@@ -1,17 +1,17 @@
 FROM node:22.16.0-alpine3.20@sha256:2289fb1fba0f4633b08ec47b94a89c7e20b829fc5679f9b7b298eaa2f1ed8b7e
 
-RUN apk add --no-cache tini bash
+ENV CHOKIDAR_USEPOLLING=true \
+  PATH="${PATH}:/usr/src/app/web/bin" \
+  COREPACK_HOME=/tmp
 
-USER node
-WORKDIR /usr/src/app
-
-COPY --chown=node:node ./web/package* ./web/
+RUN npm install --global corepack@latest && \
+  corepack enable && corepack install -g pnpm && \
+  apk add --no-cache tini make bash && \
+  mkdir -p /buildcache/pnpm-store && \
+  pnpm config set store-dir /buildcache/pnpm-store
 
 WORKDIR /usr/src/app/web
-RUN npm ci
 
-ENV CHOKIDAR_USEPOLLING=true \
-  PATH="${PATH}:/usr/src/app/web/bin"
 EXPOSE 24678
 EXPOSE 3000
 ENTRYPOINT ["tini", "--", "/bin/bash", "-c"]

web/bin/immich-web

@@ -1,14 +1,11 @@
 #!/usr/bin/env sh
 
-TYPESCRIPT_SDK=/usr/src/app/open-api/typescript-sdk
-
-npm --prefix "$TYPESCRIPT_SDK" install
-npm --prefix "$TYPESCRIPT_SDK" run build
-
-cd /usr/src/app/web || exit 1
+echo "Build dependencies for Immich Web"
+cd /usr/src/app || exit
 
 COUNT=0
 UPSTREAM="${IMMICH_SERVER_URL:-http://immich-server:2283/}"
+UPSTREAM="${UPSTREAM%/}"
 until wget --spider --quiet "${UPSTREAM}/api/server/config" > /dev/null 2>&1; do
     if [ $((COUNT % 10)) -eq 0 ]; then
       echo "Waiting for $UPSTREAM to start..."
@@ -16,7 +13,6 @@ until wget --spider --quiet "${UPSTREAM}/api/server/config" > /dev/null 2>&1; do
     COUNT=$((COUNT + 1))
     sleep 1
 done
-
-echo "Connected to $UPSTREAM"
-
-npx vite dev --host 0.0.0.0 --port 3000
+echo "Connected to $UPSTREAM, starting Immich Web..."
+pnpm --filter @immich/sdk build
+pnpm --filter immich-web exec vite dev --host 0.0.0.0 --port 3000

web/package.json

@@ -19,7 +19,7 @@
     "lint:fix": "npm run lint -- --fix",
     "format": "prettier --check .",
     "format:fix": "prettier --write . && npm run format:i18n",
-    "format:i18n": "npx --yes sort-json ../i18n/*.json",
+    "format:i18n": "pnpx sort-json ../i18n/*.json",
     "test": "vitest --run",
     "test:cov": "vitest --coverage",
     "test:watch": "vitest dev",
@@ -50,13 +50,13 @@
     "justified-layout": "^4.1.0",
     "lodash-es": "^4.17.21",
     "luxon": "^3.4.4",
-    "maplibre-gl": "^5.3.0",
+    "maplibre-gl": "^5.6.2",
     "pmtiles": "^4.3.0",
     "qrcode": "^1.5.4",
     "socket.io-client": "~4.8.0",
     "svelte-gestures": "^5.1.3",
     "svelte-i18n": "^4.0.1",
-    "svelte-maplibre": "^1.0.0",
+    "svelte-maplibre": "^1.2.0",
     "svelte-persisted-store": "^0.12.0",
     "tabbable": "^6.2.0",
     "thumbhash": "^0.1.1"

web/src/service-worker/fetch-event.ts

@@ -69,8 +69,11 @@ function isIgnoredFileType(pathname: string): boolean {
 }
 
 function isIgnoredPath(pathname: string): boolean {
-  return /^\/(src|api)(\/.*)?$/.test(pathname) || /^\/(node_modules|@vite|@id)(\/.*)?$/.test(pathname);
+  return (
+    /^\/(src|api)(\/.*)?$/.test(pathname) || /node_modules/.test(pathname) || /^\/@(vite|id)(\/.*)?$/.test(pathname)
+  );
 }
+
 function isAssetRequest(pathname: string): boolean {
   return /^\/api\/assets\/[a-f0-9-]+\/(original|thumbnail)/.test(pathname);
 }

web/vite.config.ts

@@ -4,7 +4,7 @@ import tailwindcss from '@tailwindcss/vite';
 import { svelteTesting } from '@testing-library/svelte/vite';
 import path from 'node:path';
 import { visualizer } from 'rollup-plugin-visualizer';
-import { defineConfig } from 'vite';
+import { defineConfig, type UserConfig } from 'vite';
 
 const upstream = {
   target: process.env.IMMICH_SERVER_URL || 'http://immich-server:2283/',
@@ -59,4 +59,4 @@ export default defineConfig({
       hooks: 'list',
     },
   },
-});
+} as UserConfig);