Что нового

i18n по компоненту

Name: Intlayer
Rating: 4.92 (64 reviews)
Author: Intlayer

Типобезопасный. Переводите с ИИ. Редактируйте визуально.

Определяйте переводы рядом с компонентами, чтобы ускорить разработку. Сохраняйте свой бандл максимально лёгким. Приглашайте редакторов через CMS. Каждый вклад по-настоящему ценится.

npx intlayer init

Поддержать проект Начать

Доступно для

База кода

Компилятор

Визуальный редактор

Перевести

Тест

// src/component/server/component.content.tsimport { t, type Dictionary } from "intlayer";const componentContent = {  key: "server-component",  content: {    title: t({      en: "Title of my component",      fr: "Titre de mon component",      es: "Título de mi componente",    }),    content:      "Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.",  },} satisfies Dictionary;export default componentContent;

// src/components/Component.tsxexport const Component = () => {  return (    <div>      <h2>Intlayer Compiler</h2>      <p>        The Intlayer Compiler extracts automatically the content from the        components and generates the dictionary files.      </p>    </div>  );};

Intlayer compiler

The Intlayer Compiler automatically extracts the content from the components and generates the dictionary files.

Попробуйте бесплатно, воспользовавшись песочницей.Перейти к плейграунду

Английский

Японский

Испанский

Русский

Французский

Китайский

Арабский

intlayer test

$ npx intlayer test

~/Desktop/MyApp

Повышайте поддерживаемость кода, сохраняя определения контента рядом с вашими компонентами. Уменьшайте избыточность, повышайте ясность и упрощайте обновления с помощью структурированного подхода, который делает ваш код более управляемым и масштабируемым.

Извлеките свой контент мгновенно с помощью Intlayer Compiler. Он автоматически сгенерирует необходимые файлы словаря для вашего контента, чтобы ваше приложение стало международным за одну секунду.

Используйте бесплатный визуальный редактор для легкого создания и управления сайтом. Создавайте, редактируйте и организуйте компоненты и страницы без необходимости работы с кодом, упрощая сотрудничество контент-менеджеров и разработчиков.

Расширьте охват с помощью встроенной поддержки перевода. Легко переводите свой контент, используя удобный интерфейс, обеспечивая плавный многоязычный опыт для пользователей без необходимости вручную управлять несколькими версиями контента.

Используйте Intlayer CLI для тестирования и автоматического заполнения вашего контента с помощью ИИ, чтобы все переводы были полными и точными.

Почему стоит выбрать Intlayer?

Бесплатно и с открытым исходным кодом

Intlayer бесплатен и с открытым исходным кодом, что позволяет вам использовать его бесплатно и вносить изменения по мере необходимости.

Управление контентом на базе JavaScript

Используйте гибкость JavaScript, чтобы эффективно определять и управлять своим контентом.

Типобезопасная среда

Используйте TypeScript, чтобы гарантировать, что все ваши определения контента точны и свободны от ошибок.

Декларация на уровне компонента

Держите переводы рядом с соответствующими компонентами, улучшая поддерживаемость и ясность.

Упрощенный процесс настройки

Быстро начните работу с минимальной настройкой, особенно оптимизированной для проектов Next.js.

Интегрированная CMS

Редактируйте свой контент на своем сайте с помощью интегрированной CMS непосредственно на вашем сайте. Ускорьте создание контента благодаря ИИ.

Технология

Посмотреть бенчмарк Читать полный отчет

Бенчмарк производительности I18n

Что это за метрика?

Общий размер пакета библиотеки интернационализации в формате gzip. Он включает в себя только провайдер и логику извлечения контента после tree-shaking и минификации.

Почему это важно?

Меньший размер библиотеки снижает начальную загрузку JavaScript, что ускоряет загрузку и выполнение кода на клиенте.

Анализируйте глобальный балл локализации вашего сайта

Быстро и бесплатно оцените качество локализации вашего сайта. Проанализируйте основные многоязычные элементы вашего сайта, чтобы получить комплексную оценку и практические рекомендации для увеличения охвата.

Перейти к сканеру

i18n на основе кода

Типобезопасные переводы, живущие в вашем репозитории.

Объявляйте контент рядом с компонентами на TypeScript или JavaScript. Intlayer автоматически генерирует типы, обеспечивая автодополнение, валидацию и мгновенную обратную связь. Больше никаких пропущенных ключей.

Начать кодить

AI CLI Tool

Автоматизируйте переводы прямо из терминала.

CLI для аудита, заполнения и перевода JSON и Markdown с помощью ИИ.

Запустите `npx intlayer fill`, чтобы найти недостающие ключи и сгенерировать переводы через OpenAI, Claude или локальные модели. Чистый Git и безопасные типы.

Попробовать CLI

Intlayer TMS

Перестаньте платить за слово. Автоматизируйте с помощью ИИ.

Открытая и self-hosted альтернатива Crowdin и Lokalise. Создана для современных рабочих процессов разработчиков.

Управляйте переводами прямо в коде или через визуальный редактор. Используйте ИИ для мгновенного перевода. Сотрудничайте с командой без ограничений по местам.

Смотреть TMS

Headless CMS

Объедините локальный код с удаленным контентом.

Управляйте многоязычным контентом без накладных расходов. Intlayer соединяет локальные словари с удаленным управлением, обеспечивая Live Sync для горячих обновлений. Используйте вебхуки для CI/CD и управляйте флагами функций.

Смотреть CMS

Флаги функций

Переключайте функции мгновенно. Деплой не требуется.

Словари Intlayer — это больше, чем просто текст. Используйте их для логики, стилей и конфигураций. С Live Sync вы можете включать/выключать функции, менять темы UI и обновлять поведение приложения в реальном времени из CMS.

Пробовать функции

A/B тестирование

Ваша площадка для экспериментов с продуктом.

Станьте первыми, кто исследует новую бета-версию A/B-тестирования на базе ИИ от Intlayer, созданную для повышения обнаруживаемости и направления более умных решений по продукту. Тестируйте что угодно в реальном времени, от текстов и дизайна до целых функций, и позвольте данным показать вам, что действительно работает.

Смотреть A/B тест

Предыдущий слайд←

Следующий слайд→

Доступно на

Попробуйте демонстрацию в реальном времени

Часто задаваемые вопросы

Что такое интернационализация (i18n)?

Интернационализация (i18n) - это процесс проектирования и разработки приложений, таких как Next.js, React или Express, для удобной поддержки нескольких языков. Она позволяет создавать многоязычные веб-сайты, упрощая процесс перевода. Инструменты, такие как TypeScript, облегчают реализацию i18n, позволяя эффективно и легко адаптировать ваше приложение к различным языкам и регионам.Узнайте больше о i18n

Каковы основные функции Intlayer?

Intlayer упрощает управление конфигурацией и позволяет интернационализировать различные типы JavaScript-приложений, включая серверные компоненты. Он позволяет объявлять содержимое непосредственно рядом с компонентами, улучшая поддерживаемость кодовой базы. Кроме того, Intlayer использует TypeScript, чтобы предотвратить отсутствие деклараций. Наконец, Intlayer предлагает визуальный редактор, позволяя недевелоперам редактировать содержимое сайта, автоматически переводить с помощью ИИ и оптимизировать SEO приложения.Узнайте больше о функциях Intlayer

Есть ли визуальный редактор в Intlayer?

Да, Intlayer предоставляет необязательный визуальный редактор для легкого управления содержимым, не углубляясь в код.Узнайте больше о визуальном редакторе

Какова стоимость использования Intlayer?

Intlayer интегрирует подборку бесплатных пакетов NPM вместе с визуальным редактором. Кроме того, он предлагает CMS для внешнего управления контентом. Этот CMS бесплатен в использовании, но включает дополнительные функции для участников планов Premium и Enterprise.Узнайте больше о планах Intlayer

Могу ли я интегрировать Intlayer на основе существующих решений?

Да, Intlayer можно интегрировать в качестве обертки вокруг i18next, next-intl, vue-i18next и других. Это позволяет автоматизировать перевод и использовать Intlayer без необходимости рефакторить существующий код.

Что такое Intlayer?

Intlayer - это пакет, который позволяет вам управлять вашим многоязычным веб-сайтом. Он предоставляет набор инструментов и утилит, которые облегчают настройку вашего веб-сайта для многоязычного контента и локализации.Узнайте больше о Intlayer

Как Intlayer интегрируется с Next.js?

Intlayer интегрируется с Next.js, чтобы обеспечить рендеринг на стороне сервера и генерацию статических сайтов, делая доставку многоязычного контента более эффективной.Узнайте больше об интеграции с Next.js

Как я могу сделать вклад в Intlayer?

Вы можете внести свой вклад, отправив запросы на извлечение или сообщив об ошибках в репозитории GitHub.Узнайте больше о том, как внести свой вклад

Какие платформы поддерживает Intlayer?

Intlayer доступен для React (включая Create React App), Vite с React, Next.js, Tanstack Start, Vue, Nuxt, Express, NestJS, Preact и других. Это обеспечивает бесшовную интеграцию с современными JavaScript-фреймворками и серверными средами.Узнайте больше о поддерживаемых платформах

Прочитать все часто задаваемые вопросы