このページとあなたの好きなAIアシスタントを使ってドキュメントを要約します
Intlayer MCPサーバーを統合することで、ChatGPT、DeepSeek、Cursor、VSCodeなどから直接ドキュメントを取得できます。
MCPサーバーのドキュメントを表示このページのコンテンツはAIを使用して翻訳されました。
英語の元のコンテンツの最新バージョンを見るこのドキュメントを改善するアイデアがある場合は、GitHubでプルリクエストを送信することで自由に貢献してください。
ドキュメントへのGitHubリンクドキュメントのMarkdownをクリップボードにコピー
ファイルコンテンツ / Intlayerでのファイル埋め込み
ファイル埋め込みの仕組み
Intlayerでは、file 関数を使用して外部ファイルの内容を辞書に埋め込むことができます。この方法により、Intlayerはソースファイルを認識し、IntlayerビジュアルエディターやCMSとのシームレスな統合を可能にします。直接的な import、require、または fs によるファイル読み込み方法とは異なり、file を使用するとファイルが辞書に関連付けられ、ファイルが編集されるとIntlayerがコンテンツを動的に追跡および更新できるようになります。
ファイルコンテンツの設定
Intlayerプロジェクトにファイルコンテンツを埋め込むには、コンテンツモジュール内で file 関数を使用します。以下に異なる実装例を示します。
コードをクリップボードにコピー
import { file, type Dictionary } from "intlayer";const myFileContent = { key: "my_key", content: { myFile: file("./path/to/file.txt"), },} satisfies Dictionary;export default myFileContent;
React Intlayerでのファイルコンテンツの使用
Reactコンポーネント内で埋め込まれたファイルコンテンツを使用するには、react-intlayerパッケージからuseIntlayerフックをインポートして使用します。これにより、指定されたキーからコンテンツを取得し、動的に表示することができます。
コードをクリップボードにコピー
import type { FC } from "react";import { useIntlayer } from "react-intlayer";const FileComponent: FC = () => { const { myFile } = useIntlayer("my_key"); return ( <div> <pre>{myFile}</pre> </div> );};export default FileComponent;
多言語対応Markdownの例
多言語対応の編集可能なMarkdownファイルをサポートするために、fileをt()およびmd()と組み合わせて使用し、Markdownコンテンツファイルの異なる言語バージョンを定義できます。
コードをクリップボードにコピー
import { file, t, md, type Dictionary } from "intlayer";const myMultilingualContent = { key: "my_multilingual_key", content: { myContent: md( t({ en: file("src/components/test.en.md"), fr: file("src/components/test.fr.md"), es: file("src/components/test.es.md"), }) ), },} satisfies Dictionary;export default myMultilingualContent;
この設定により、ユーザーの言語設定に基づいてコンテンツを動的に取得することが可能になります。IntlayerのビジュアルエディターやCMSで使用される場合、システムはコンテンツが指定されたMarkdownファイルから来ていることを認識し、それらが編集可能なままであることを保証します。
Intlayerがファイルコンテンツを処理する方法
file関数はNode.jsのfsモジュールに基づいており、指定されたファイルの内容を読み取り、辞書に挿入します。IntlayerのビジュアルエディターやCMSと組み合わせて使用される場合、Intlayerは辞書とファイルの関係を追跡できます。これによりIntlayerは以下を可能にします:
- コンテンツが特定のファイルから来ていることを認識する。
- リンクされたファイルが編集されたときに辞書のコンテンツを自動的に更新する。
- ファイルと辞書の同期を確保し、コンテンツの整合性を維持します。
追加リソース
Intlayerでのファイル埋め込みの設定および使用方法の詳細については、以下のリソースを参照してください:
- Intlayer CLI ドキュメント
- React Intlayer ドキュメント
- Next Intlayer ドキュメント
- Markdown コンテンツ ドキュメント
- ファイルと辞書の同期を確保し、コンテンツの整合性を保持します。
追加リソース
Intlayerでのファイル埋め込みの設定および使用方法の詳細については、以下のリソースを参照してください:
これらのリソースは、ファイル埋め込み、コンテンツ管理、およびIntlayerのさまざまなフレームワークとの統合に関するさらなる洞察を提供します。
ドキュメント履歴
- 5.5.10 - 2025-06-29: 履歴の初期化