Files
sodalive-vuejs-creator-admin/docs/20260508_국제화도입.md

2.0 KiB

국제화(i18n) 도입 계획

목표

  • Vue 2 + Vuetify 2 기반에서 한국어(ko), 영어(en), 일본어(ja) 3개 언어를 지원한다.
  • 브라우저 설정을 기본 로케일로 사용하되, 사용자가 선택한 언어가 있으면(localStorage) 그 값을 우선한다.

체크리스트

  • vue-i18n v8 도입 및 기본 설정(src/i18n/index.js)
  • 리소스 파일 생성(src/locales/ko.json, src/locales/en.json, src/locales/ja.json)
  • Vuetify 언어팩 연동(src/plugins/vuetify.js) 및 초기 로케일 동기화
  • main.js에서 vue-i18n ↔ Vuetify 로케일 동기화 로직 추가
  • 공통 컴포넌트 문자열 치환(네비/레이아웃/다이얼로그)
    • src/components/SideMenu.vue 로그아웃/에러/기본 메뉴 텍스트 치환
  • 주요 뷰(views/Agent/*) 1차 치환
  • 날짜/숫자/통화 포맷 정책 적용(ja: JPY 소수점 미사용 등)
  • 하드코딩 탐지/미번역 키 점검(정규식 스캔 + missing 핸들러)
  • 언어 전환 UX(드롭다운) 및 영속 저장(localStorage)

키 네이밍 규칙

  • 네임스페이스 기반: common.*, comp.*, view.*
  • 예) common.logout, common.error.unknown, comp.sideMenu.calc.live

개발 메모

  • 서버 메뉴가 비어 기본 메뉴를 사용하는 분기는 i18n 키를 사용하도록 업데이트함.
  • 서버에서 전달되는 텍스트는 과도기적으로 기존 값을 그대로 사용하며, 추후 서버가 키를 전달하도록 협업 예정.

검증 기록

1차 준비 (2026-05-08)

  • 무엇을: i18n 인프라 파일 추가, Vuetify 언어팩 연동, SideMenu 일부 치환
  • 왜: 하드코딩 텍스트를 다국어로 전환하기 위한 기반 마련
  • 어떻게:
    • 실행 명령: (로컬) npm inpm run serve 예정
    • 결과: 아직 실행 전. 의존성 설치 및 로컬 실행 시에 확인 예정
    • 보완: 언어 전환 UI/UX 및 나머지 화면 치환, 하드코딩 스캔 적용 예정