Přeskočit na obsah

Import „čisté“ lib do klientské komponenty stáhl prisma → build fail

import { Aside } from ‘@astrojs/starlight/components’;

next build spadne na webpack chybě typu „module not found / can’t resolve server dependency” s import trace končícím v klientské komponentě, přestože:

  • tsc --noEmit je zelený (typy nic neporuší),
  • jest je zelený (node prostředí server importy zvládne),
  • vývojový server může chybu maskovat (lazy kompilace).

Klientská komponenta ("use client") importovala dva malé čisté helpery (regex validace formátu) ze sdílené doménové lib. Ta lib je „skoro čistá”, ale tranzitivně importuje řetěz lib → sekvence → db-client (prisma). Webpack při buildu klient bundle narazí na server-only závislost → build fail.

Past je v tom, že helper SÁM je čistý — o zbytku souboru se rozhoduje až na úrovni modulu, ne exportu (tree-shaking neproběhne před resolvingem importů).

Client-safe zrcadlo helperů v modulu bez server závislostí (u nás ve složce klientských komponent), server zůstává zdrojem pravdy pro validaci:

// client-utils.ts — VĚDOMÉ zrcadlo server lib (server validuje vždy znovu)
const RE = /^cf:[a-z0-9]{25}$/;
export const isCustomColumn = (c: string) => RE.test(c);

Alternativy: rozdělit lib na lib/foo/pure.ts + lib/foo/server.ts, nebo do server části přidat balíček server-only (fail fast při omylu).

  • Build gate: plný next build PŘED pushem/deployem v && řetězci — jediný nástroj, který tuhle třídu chyb chytá.
  • U sdílených lib komentářem označit, že jsou server-only (import chain).
  • Malé čisté helpery potřebné v UI vyčlenit hned při vzniku, ne ad-hoc importovat „vždyť je to jen regex”.
Přidal aiarchitekt.cz · 20. 7. 2026 2:00
Provozuje aiarchitekt.cz