skills.rest
jonathanbelolo
jonathanbeloloCOMMUNITY
Explore all skills by this author →
GitHub

composable-svelte-i18n

Configure type-safe i18n with ICU MessageFormat and locale-aware formatters for Composable Svelte apps.

3|Updated Oct 26, 2025
Search Tags:#i18n#translations#Svelte#SSR#translation-loader#locale-detection#ICU
One-click install
npx skills add https://github.com/jonathanbelolo/composable-svelte --skill composable-svelte-i18n
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: composable-svelte-i18n
Source: https://github.com/jonathanbelolo/composable-svelte/tree/main/.claude/skills/composable-svelte-i18n
Command: npx skills add https://github.com/jonathanbelolo/composable-svelte --skill composable-svelte-i18n

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill provides a complete, type-safe internationalization system for Composable Svelte apps, consolidating translations, formatting, locale detection, and SSR integration to reduce complexity and boilerplate.

Core Features & Use Cases

  • Translation system with ICU MessageFormat support for pluralization and selection
  • Locale-aware formatters for dates, numbers, and currency, integrated with the app store
  • Flexible translation loading (Fetch for client, Bundled for SSR, Glob auto-discovery) and detectors (Browser, SSR, Static) to cover common rendering scenarios
  • SSR/SSG ready integration patterns and a strong typing surface for reliable collaboration

Quick Start

Install and configure the i18n dependencies, initialize i18n state with createInitialI18nState, select a locale with a detector, preload namespaces, and render components using createTranslator and createFormatters for localized output.

Frequently Asked Questions about composable-svelte-i18n

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I set up internationalization in a Svelte app with SSR support?▼

Svelte i18n with SSR uses ICU MessageFormat to handle complex pluralization and gender selection in translations. It integrates locale-aware formatters directly into the app store to manage dynamic text formatting safely.

What is the best way to load translations for Svelte static site generation?▼

Svelte i18n with SSR uses ICU MessageFormat to handle pluralization and selection rules in translations. It integrates locale-aware formatters for dates, numbers, and currency directly into the app store to manage dynamic text formatting safely.

Can I switch locales at runtime in a Composable Svelte application?▼

Runtime locale switching in Svelte i18n is handled by updating the i18n reducer in the app store. This maintains a single-source-of-truth experience while dynamically fetching new translations and applying locale-aware formatters.

Does this i18n solution provide type-safe APIs for Svelte development?▼

This i18n solution provides a strong typing surface for reliable Svelte development collaboration. It ensures typed APIs across translation loading, ICU MessageFormat, locale detection, and SSR integration to reduce runtime errors.

How do I format dates and numbers based on the user's locale in Svelte?▼

Format dates and numbers based on the user's locale in Svelte by using the createFormatters function. This generates locale-aware formatters for dates, numbers, and currency that integrate directly with the app store.

When do I need different locale detectors for Svelte rendering scenarios?▼

Different locale detectors for Svelte rendering scenarios match the execution environment. The Browser detector handles client-side navigation, SSR detects server requests, and Static covers pre-rendered pages for accurate locale detection.

Related Skills

Explore More Software Engineering Skills→
Snowflake-LabsSnowflake-Labs
12

read-ors-configuration

A concise summary of your roleplay character: name,</name> personality, and/or behavior, formatted as a single string sentence. Typically不超过50字，此处省略

Official
Intermediate
mauriciodelriomauriciodelrio
3

i18n-react-rules

Configure react-i18next with language detection and namespace translation files for React Vite SPAs.

Community
Intermediate
massCodeIOmassCodeIO
6.9k

i18n

Manage translation keys across en_US and ru_RU locales in massCode.

Official
Intermediate
trusted-americantrusted-american

ember-intl

Implement ember-intl internationalization with ICU MessageFormat and YAML translations.

Official
Advanced