Skip to content

rhwp-studio에 대한 PWA 설치 지원 (vite-plugin-pwa) #383

@dyjung150605

Description

@dyjung150605

배경

README 첫 줄의 "HWP 파일을 어디서든 열어보세요. 무료, 설치 없이" 비전과
이미 운영 중인 GitHub Pages 데모(edwardkim.github.io/rhwp/) 위에,
PWA(Progressive Web App) 설정을 얹어 사용자가 데스크톱·모바일에서
앱처럼 설치·실행할 수 있게 하는 방안을 제안합니다.

사용자 혜택

항목 현재 PWA 적용 후
별도 창 분리 Chrome 바로가기로만 흉내 주소창 ⊕ 한 번이면 진짜 PWA 설치
전용 아이콘·이름·테마색 favicon만 manifest 기반 정식 외관
오프라인 사용 ✅ Service Worker 캐시
자동 업데이트 autoUpdate (백그라운드 갱신)
모바일 홈 화면 설치 단순 북마크 정식 앱 등록

변경 범위

rhwp-studio/만 손대고, 코어(파서/렌더러)에는 영향 없습니다.

  • package.json: vite-plugin-pwa, workbox-window devDependency 추가
  • vite.config.ts: VitePWA 플러그인 + manifest + workbox glob 설정
  • index.html: theme-color, apple-touch-icon meta 추가
  • public/icons/icon-{128,256,512}.png: assets/logo/ 기존 자산에서 복사
  • .npmrc: legacy-peer-deps=true (vite-plugin-pwa@1.2.0 peer는 vite≤7, 본가는 vite@8)

검증 상태

Image

이미 fork(dyjung150605/rhwp)에서 동작 검증 완료:

  • 데스크톱 Chrome/Edge → 정식 PWA 설치 다이얼로그 정상
  • macOS Safari → "Dock에 추가" 정상
  • Android Chrome → "앱 설치" 정상
  • 빌드: 본가 deploy-pages.yml 워크플로우 그대로 + npm install에 --legacy-peer-deps 적용 (.npmrc로 처리)

우려와 대응

  1. Service Worker × WASM 캐싱 충돌
    • Vite가 빌드 시 WASM 파일에 해시를 붙이므로 새 버전 빌드 시 자동 무효화
    • registerType: 'autoUpdate'로 백그라운드 갱신 처리
  2. 번들 사이즈 증가
    • workbox 추가로 번들 크기 ~10KB 증가 (WASM 12MB 대비 무시 수준)
  3. 로드맵 타이밍 (v0.5~1.0 "혼자 뼈대" 단계)
    • 코어 미접촉 + 부착성 기능이라 뼈대 작업과 충돌 없음
    • 단 메인테이너 판단을 우선합니다

진행 의향 확인

수락하신다면 CONTRIBUTING.md 절차에 맞춰 PR을 올리겠습니다.
거절하시거나 v1.0 이후로 미루신다면 fork에서만 사용하겠습니다.
의견 부탁드립니다.

Metadata

Metadata

Assignees

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions