Skip to content

fix(vite-plugin): complete every environment's sheets after the app build - #953

Open
owjs3901 wants to merge 2 commits into
mainfrom
fix/vite-complete-environment-sheets
Open

owjs3901 wants to merge 2 commits into
mainfrom
fix/vite-complete-environment-sheets

Conversation

@owjs3901

Copy link
Copy Markdown
Contributor

Summary

Vite는 한 앱의 환경(client, ssr, ...)을 하나의 공유 엔진 위에서 차례로 빌드합니다. 각 환경은 자기 빌드가 끝나는 시점의 devup-ui 시트를 내보내므로, 나중 환경만 추출하는 스타일(서버만 렌더링하는 모듈)이 client CSS에 들어가지 않았고, 결과가 빌드 순서에 따라 달라졌습니다.

  • 실측(singleCss, client→ssr 순서): client의 devup-ui.css에 SSR 전용 스타일(color:green)이 빠짐. ssr→client 순서에서는 포함됨.
  • environment-sheets.ts(신규): 각 환경이 generateBundle에서 내보낸 시트(fileNum → CSS)를 기록하고, writeBundle에서 쓴 파일을 기록합니다.
  • devup-ui:complete-environment-sheets 플러그인(buildApp, order: 'post', sharedDuringBuild): 아직 빌드된 환경이 없으면 Vite 기본 동작과 같은 순서로 모두 빌드한 뒤, 기록된 시트가 현재 getCss와 다른 환경만 이전 출력 파일을 지우고 다시 빌드합니다. 이 시점에는 모든 모듈이 추출되어 있으므로 한 번의 재빌드로 시트가 확정됩니다.
  • 시트가 바뀌지 않으면 추가 빌드는 없습니다.
  • 한계: SSR 전용 모듈의 파일별 버킷(split 모드의 devup-ui-N.css)은 Vite CSS 의미상 client 번들에 들어가지 않습니다. 이 PR은 각 환경이 내보내는 시트를 완전하게 만드는 것이고, 환경 간 버킷을 옮기지는 않습니다.

관련/겹치는 PR:

Refs #694

Test plan

  • bun --config=./bunfig.vite.toml test environment-sheets: 단위 테스트(전체 빌드, 이미 빌드된 환경 유지, 바뀐 환경만 재빌드, 이전 출력 삭제) + 실제 Vite createBuilder 빌드를 client→ssr, ssr→client 두 순서로 실행해 singleCss 출력이 같고 client CSS에 SSR 전용 스타일이 포함됨을 확인. split 모드는 각 환경이 자기 스타일을 모두 갖는지 확인
  • 수정 전에는 singleCss 순서 비교 테스트가 실패함을 확인
  • plugin.test.ts에 재빌드 경로 테스트 추가, environment-sheets.ts 커버리지 100%
  • bunx tsc --noEmit (vite-plugin), prettier
  • CI

🤖 Generated with Claude Code

…uild

Vite builds the environments of one app (client, ssr, ...) one after
another on one shared engine. Each environment emits its devup-ui sheets
as they stand when it finishes, so a style only a later environment
extracts (a module only the server renders) never reached the client CSS,
and the output depended on the build order.

Record what each environment emitted of every devup-ui sheet, and in a
post buildApp hook, once every environment is built, build again each
environment whose sheets changed since, after removing the files it wrote
before. Every module is extracted by then, so a single pass leaves each
sheet final.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
…trix

An environment whose sheets changed after the app build is now built again,
and only in one order, so the matrix compares the extractions once each.
The sheets each environment emits no longer depend on the order, so the
environments scenario compares the written assets too.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
@codecov

codecov Bot commented Nov 15, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.

Files with missing lines Coverage Δ
packages/vite-plugin/src/environment-sheets.ts 100.00% <100.00%> (ø)
packages/vite-plugin/src/plugin.ts 100.00% <100.00%> (ø)
🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

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

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant