Intlayer Documentation
Intlayerドキュメントへようこそ。このガイドは、Intlayerの概要、主な機能、およびこれらの文書を効果的に活用して開発体験を向上させる方法を提供します。
Introduction
What is Intlayer?
Intlayerは、JavaScript開発者のために特別に設計された国際化ライブラリです。コード内のどこにでもコンテンツを宣言することを可能にします。マルチリンガルコンテンツの宣言を構造化された辞書に変換し、コードに簡単に組み込めるようにします。TypeScriptを使用することで、Intlayerは開発をより強化し、効率化します。
Intlayerは、コンテンツを簡単に編集および管理できるオプションのビジュアルエディタも提供します。このエディタは、コンテンツ管理のためのビジュアルインターフェースを好む開発者や、コードを気にせずにコンテンツを生成するチームに特に便利です。
Example of usage
bash
.└── Components └── MyComponent ├── index.content.ts └── index.tsx
src/components/MyComponent/index.content.ts
import { type DeclarationContent, t } from "intlayer";const componentContent = { key: "component-key", content: { myTranslatedContent: t({ en: "Hello World", fr: "Bonjour le monde", es: "Hola Mundo", }), },} satisfies DeclarationContent;export default componentContent;
src/components/MyComponent/index.tsx
import type { FC } from "react";import { useIntlayer } from "react-intlayer";export const MyComponent: FC = () => { const { myTranslatedContent } = useIntlayer("component-key"); return <span>{myTranslatedContent}</span>;};
Main Features
Intlayerは、現代のウェブ開発のニーズに応えるために特化したさまざまな機能を提供します。以下は、各機能の詳細なドキュメントへのリンクとともに、主な機能です。
- Internationalization Support: 国際化をサポートするビルトイン機能でアプリケーションのグローバルなリーチを向上させます。
- Visual Editor: Intlayer向けのエディタプラグインで開発ワークフローを改善します。Visual Editor Guideをご覧ください。
- Configuration Flexibility: Configuration Guideに詳細に記載された広範な設定オプションでセットアップをカスタマイズします。
- Advanced CLI Tools: Intlayerのコマンドラインインターフェースを使用してプロジェクトを効率的に管理します。CLI Tools Documentationで機能を探ってください。
- Compatibility with i18n: Intlayerは他の国際化ライブラリとシームレスに動作します。i18n Guideで詳細をご覧ください。
Platforms Supported
Intlayerは、Next.jsおよびReactアプリケーションとシームレスに動作するように設計されています。また、ViteおよびCreate React Appもサポートしています。
- Next.js Integration: サーバーサイドレンダリングおよび静的サイト生成のために、Intlayer内でNext.jsのパワーを利用します。詳細は、Next.js Integration Guideをご覧ください。
- Vite and React Integration: サーバーサイドレンダリングおよび静的サイト生成のために、Intlayer内でViteを活用します
このドキュメントを改善するアイデアがある場合は、GitHubでプルリクエストを送信することで自由に貢献してください。
ドキュメントへのGitHubリンク