홈샌드박스쇼케이스앱문서블로그
    • English영어
      EN
    • русский러시아어
      RU
    • 日本語일본어
      JA
    • français프랑스어
      FR
    • 한국어한국어
      KO
    • 中文중국어
      ZH
    • español스페인어
      ES
    • Deutsch독일어
      DE
    • العربية아랍어
      AR
    • italiano이탈리아어
      IT
    • British English영어(영국)
      EN-GB
    • português포르투갈어
      PT
    • हिन्दी힌디어
      HI
    • Türkçe튀르키예어
      TR
    • polski폴란드어
      PL
    • Indonesia인도네시아어
      ID
    • Tiếng Việt베트남어
      VI
    • українська우크라이나어
      UK
    /
    프레임워크로 문서 필터링
    Alt+←
    Intlayer의 이점
    시작하기
    개념
    • Intlayer 작동 방식
    • 구성
    • TestFillBuildWatchExtractLoginPushPullConfigurationListVersionEditorLiveDebugDoc ReviewDoc TranslateSDK
    • 비주얼 편집기
    • CMS
    • CI/CD 통합
    • 번역복수형열거조건성별삽입파일중첩MarkdownHTML함수 가져오기
    • 로케일별 파일
    • 컴파일러
    • 자동 채우기
    • 테스트
    • 번들 최적화
    환경
    • Next.js 14 및 앱 라우터
      Next.js 15
      Next.js 로케일 없는 URL
      Next.js 및 페이지 라우터
      컴파일러
    • Tanstack Start Solid
    • Astro 및 React
      Astro 및 Svelte
      Astro 및 Vue
      Astro 및 Solid
      Astro 및 Preact
      Astro 및 Lit
      Astro 및 Vanilla JS
    • React Router v7
      React Router v7 (fs-routes)
      Compiler
    • Nuxt 및 Vue
    • Vite 및 Solid
    • SvelteKit
    • Vite 및 Preact
    • Vite 및 Vanilla JS
    • Vite 및 Lit
    • Angular 19 (Webpack)
      Analog
    • React CRA
    • React Native 및 Expo
    • Express.js
      NestJS
      Fastify
      Hono
      Adonis
    • Lynx 및 React
    Plugins
    • JSON
    • gettext (.po)
    VS Code 확장 기능
    에이전트
    • MCP 서버
    • 에이전트 기술
    릴리스
    • v8
    • v7
    • v6
    벤치마크
    • Next.js
    • TanStack
    • Vue
    • Solid
    • Svelte
    블로그
    질문 발표
    1. Documentation
    2. 개념
    3. 콘텐츠 선언
    4. 복수형
    생성:2026-05-04마지막 업데이트:2026-05-04
    이 문서를 원하는 AI 어시스턴트에 참조하세요
    ChatGPT
    Claude
    DeepSeek
    Google AI mode
    Gemini
    Perplexity
    Mistral
    Grok

    이 페이지와 원하는 AI 어시스턴트를 사용하여 문서를 요약합니다

    버전 기록

    1. "Init history"
      v8.8.02026. 5. 4.

    이 페이지의 콘텐츠는 AI를 사용하여 번역되었습니다.

    영어 원본 내용의 최신 버전을 보기
    문서 수정

    이 문서를 개선할 아이디어가 있으시면 GitHub에 풀 리퀘스트를 제출하여 자유롭게 기여해 주세요.

    문서에 대한 GitHub 링크
    복사

    문서의 Markdown을 클립보드에 복사

    복수형 콘텐츠 / Intlayer의 복수형

    복수형 작동 방식

    Intlayer에서 복수형 콘텐츠는 plural 함수를 통해 구현됩니다. 이 함수는 CLDR 복수형 범주(zero, one, two, few, many, other)를 해당 콘텐츠에 매핑합니다. 플랫폼에 내장된 Intl.PluralRules API를 사용하여 활성 로케일과 카운트 값을 기반으로 올바른 범주가 자동으로 선택됩니다.

    직접 정의한 숫자 범위를 기반으로 콘텐츠를 선택하는 enu와 달리, plural은 선택을 CLDR 규칙에 위임합니다. 이로 인해 러시아어, 폴란드어, 아랍어 또는 웨일스어와 같이 복잡한 복수화 규칙이 있는 언어도 나머지 연산(modulo) 로직을 직접 작성하지 않고도 확장할 수 있습니다.

    plural vs enu 사용 시기

    테이블의 모든 내용 표시

    테이블을 모달로 열어 모든 데이터를 명확하게 확인

    사용 사례 헬퍼
    로케일 인식 문법적 복수형 (사과 1개 / 사과 2개 / 사과 5개) plural
    사용자 정의 숫자 범위 (<5, >=10) 또는 CLDR 이외의 버킷 enu

    영어(one / other만 있음)만 타겟팅하는 경우 둘 다 작동합니다. few / many / two 구분이 있는 언어의 경우 plural을 권장합니다.

    복수형 콘텐츠 설정

    Intlayer 프로젝트에서 복수형 콘텐츠를 설정하려면 plural 헬퍼를 사용하는 콘텐츠 모듈을 생성하십시오. other 범주는 필수이며, 로케일에 더 구체적인 범주가 정의되지 않았을 때 폴백으로 사용됩니다.

    **/*.content.ts
    코드 복사

    코드를 클립보드에 복사

    import { plural, t, type Dictionary } from "intlayer";
    
    const openingsContent = {
      key: "total_openings",
      content: {
        totalOpenings: t({
          en: plural({
            one: "{{count}} opening",
            other: "{{count}} openings",
          }),
          ko: plural({
            other: "{{count}}개의 채용 공고",
          }),
        }),
      },
    } satisfies Dictionary;
    
    export default openingsContent;

    지원되는 범주는 zero, one, two, few, many, other입니다. 타겟 언어가 사용하는 범주만 선언하면 되며, 특정 범주가 일치하지 않으면 Intlayer는 other로 폴백합니다.

    {{count}} 플레이스홀더는 런타임에 전달하는 카운트로 자동으로 대체됩니다. 다른 플레이스홀더를 포함할 수도 있습니다(아래 사용자 정의 플레이스홀더 참조).

    React Intlayer와 함께 복수형 콘텐츠 사용하기

    React 컴포넌트 내에서 복수형 콘텐츠를 사용하려면 useIntlayer 훅을 통해 가져와 카운트와 함께 호출하십시오. 활성 로케일과 카운트가 결합되어 일치하는 CLDR 범주를 선택합니다.

    **/*.tsx
    코드 복사

    코드를 클립보드에 복사

    import type { FC } from "react";
    import { useIntlayer } from "react-intlayer";
    
    const OpeningsComponent: FC<{ count: number }> = ({ count }) => {
      const { totalOpenings } = useIntlayer("total_openings");
    
      return (
        <div>
          {/* 영어 기준:                                  */}
          {/*  count=0  → "0 openings"   (other)           */}
          {/*  count=1  → "1 opening"    (one)             */}
          {/*  count=2  → "2 openings"   (other)           */}
          {/*  count=21 → "21 openings"  (other)           */}
          <p>{totalOpenings(count)}</p>
        </div>
      );
    };
    
    export default OpeningsComponent;

    반환된 함수를 두 가지 동등한 방식으로 호출할 수 있습니다.

    tsx
    코드 복사

    코드를 클립보드에 복사

    totalOpenings(21); // 약식: 카운트만 전달totalOpenings({ count: 21 }); // 명시적 형태

    사용자 정의 플레이스홀더

    복수형 문자열에는 {{count}} 이외의 플레이스홀더를 포함할 수 있습니다. count와 함께 객체 형태로 전달하십시오.

    **/*.content.ts
    코드 복사

    코드를 클립보드에 복사

    import { plural, type Dictionary } from "intlayer";
    
    const inboxContent = {
      key: "inbox_summary",
      content: {
        summary: plural({
          other: "{{name}}님, {{count}}개의 새 메시지가 있습니다",
        }),
      },
    } satisfies Dictionary;
    
    export default inboxContent;
    **/*.tsx
    코드 복사

    코드를 클립보드에 복사

    const { summary } = useIntlayer("inbox_summary");
    
    summary({ count: 1, name: "Alice" });
    // → "Alice님, 1개의 새 메시지가 있습니다"
    
    summary({ count: 7, name: "Alice" });
    // → "Alice님, 7개의 새 메시지가 있습니다"

    CLDR 범주 요약

    언어마다 사용하는 CLDR 범주의 하위 집합이 다릅니다. 몇 가지 일반적인 사례는 다음과 같습니다.

    테이블의 모든 내용 표시

    테이블을 모달로 열어 모든 데이터를 명확하게 확인

    언어 사용되는 범주
    영어 (en) one, other
    프랑스어 (fr) one, many, other
    러시아어 (ru) one, few, many, other
    폴란드어 (pl) one, few, many, other
    아랍어 (ar) zero, one, two, few, many, other
    한국어 / 일본어 / 중국어 other 만 사용

    이를 모두 외울 필요는 없습니다. 번역이 있는 범주를 선언하면 Intlayer가 필요할 때 other로 폴백합니다.

    한계

    다른 노드와 비교할 때, plural은 아직 자식 노드와 중첩될 수 없습니다.

    예시:

    유효:

    ts
    코드 복사

    코드를 클립보드에 복사

        totalOpenings: t({      en: plural({        one: "{{count}} opening",        other: "{{count}} openings",      }),      fr: plural({        one: "{{count}} offre",        other: "{{count}} offres",      }),    }),

    무효:

    ts
    코드 복사

    코드를 클립보드에 복사

    totalOpenings: plural({  one: t({    en: "{{count}} opening",    fr: "{{count}} offre",  }),  other: t({    en: "{{count}} openings",    fr: "{{count}} offres",  }),}),

    추가 리소스

    설정 및 사용에 대한 자세한 내용은 다음 리소스를 참조하십시오.

    • Enumeration 문서
    • Insertion 문서
    • Intlayer CLI 문서
    • React Intlayer 문서
    • Next Intlayer 문서

    이 리소스들은 다양한 환경과 프레임워크에서 Intlayer의 설정 및 사용에 대한 더 깊은 통찰력을 제공합니다.

    번역
    열거
    Alt+→

    이 페이지에서

      토론은 익명이며 일반적인 문제를 해결하기 위해 정기적으로 검토됩니다. 기능 아이디어, 문서에 대한 피드백 또는 Intlayer와 관련된 모든 것을 자유롭게 공유하세요, 이 의견을 로드맵 구성과 제품 개선에 활용합니다.

      totalOpenings(21); // 약식: 카운트만 전달totalOpenings({ count: 21 }); // 명시적 형태
          totalOpenings: t({      en: plural({        one: "{{count}} opening",        other: "{{count}} openings",      }),      fr: plural({        one: "{{count}} offre",        other: "{{count}} offres",      }),    }),
      totalOpenings: plural({  one: t({    en: "{{count}} opening",    fr: "{{count}} offre",  }),  other: t({    en: "{{count}} openings",    fr: "{{count}} offres",  }),}),