Hyungi Ahn
f6393fbe66
기사시험 문제·해설에 √, ρ, R̄, α/β/γ, ㎥, $\\sqrt{...}$ 같은 수식이 자주
들어가는데 기존 plain text 표시는 LaTeX 문법이 그대로 노출되거나 깨짐.
표시·미리보기 영역에서만 KaTeX 렌더링 (입력 textarea 는 plain text 유지).
의존성: marked-katex-extension + katex (frontend/).
공통 유틸 frontend/src/lib/utils/mathMarkdown.ts:
- renderMathMarkdown(text): block 렌더 (문제 본문·해설·AI 해설용)
- renderMathMarkdownInline(text): inline parseInline (보기 1~4 button 안)
- 별도 marked 인스턴스 사용 → 글로벌 marked 영향 없음
- $...$ inline / $$...$$ block 모두 지원
- KaTeX throwOnError=false → 잘못된 수식은 빨간색 fallback (페이지 안 깨짐)
- DOMPurify USE_PROFILES.html + ADD_ATTR style/aria-hidden + FORBID
script/iframe/onclick 등 — XSS 차단 유지
- 실패 시 text-only fallback (HTML escape)
CSS (app.css):
- .math-area .katex-display { overflow-x: auto } — 모바일 가로 overflow
생기면 수식만 가로 스크롤, 페이지 레이아웃 보존
- .katex { white-space: nowrap } — KaTeX 자체 줄바꿈 방지
적용 위치 (표시·미리보기만, textarea 무변경):
- review: 문제 본문, 보기 1~4(inline), 답 제출 후 explanation, AI 해설
- edit: AI 해설 본문 (기존 marked → 통일)
- new 화면 preview / 통합뷰 카드 snippet: 무변경 (1차 보류, 사용자 요청 시 추가)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
29 lines
678 B
JSON
29 lines
678 B
JSON
{
|
|
"name": "hyungi-document-server-frontend",
|
|
"version": "0.0.1",
|
|
"private": true,
|
|
"type": "module",
|
|
"scripts": {
|
|
"dev": "vite dev",
|
|
"build": "vite build",
|
|
"preview": "vite preview",
|
|
"lint:tokens": "bash ./scripts/check-tokens.sh"
|
|
},
|
|
"devDependencies": {
|
|
"@sveltejs/adapter-node": "^5.0.0",
|
|
"@sveltejs/kit": "^2.0.0",
|
|
"@tailwindcss/vite": "^4.0.0",
|
|
"svelte": "^5.0.0",
|
|
"tailwindcss": "^4.0.0",
|
|
"vite": "^8.0.0"
|
|
},
|
|
"dependencies": {
|
|
"dompurify": "^3.3.3",
|
|
"katex": "^0.16.45",
|
|
"lucide-svelte": "^0.400.0",
|
|
"marked": "^15.0.0",
|
|
"marked-katex-extension": "^5.1.8",
|
|
"perfect-freehand": "^1.2.3"
|
|
}
|
|
}
|