Intlayerの今後のリリースに関する通知を受け取る
    作成:2025-09-22最終更新:2025-09-22

    新しい Intlayer v6 - 新機能は何ですか?

    Intlayer v6 へようこそ!このリリースはパフォーマンス、開発者体験、信頼性に重点を置いています。以下にハイライト、移行ノート、コピー&ペースト可能な例を示します。

    ハイライト

    • 新しいコマンド:npx intlayer content test で翻訳の欠落を検出
    • 新しいグローバルオプション autoFill により、欠落している翻訳を自動生成
    • Fill コマンドは既存の翻訳をスキップするのがデフォルト:npx intlayer fill
    • VS Code 拡張機能:新しい Intlayer アクティビティバー(検索&辞書)、ツールバー/コンテキストアクション、自動表示、Fill/Test コマンド
    • Promise の並列処理によりビルドが10倍高速化
    • アプリ起動時の再取得を避けるためのリモート辞書キャッシュ
    • ロギングの改善:動作を詳しく調査するには log.mode: 'verbose' を設定
    • 辞書の問題によるアプリクラッシュを防ぐ強化されたバリデーション
    • CMS と連携したライブアップデート:build.importMode = 'live'pnpm intlayer live を使用
    • 修正点:Vue.js 統合、Lynx アダプター、Windows 上のビジュアルエディター

    新機能:欠落翻訳のテスト

    プロジェクトを素早く監査し、どのキーやロケールが欠落しているかを確認します。

    bash
    npx intlayer content test

    出力:

    bash
    pnpm intlayer content test欠落している翻訳: - blog-data       - 日本語 (ja)、韓国語 (ko)、中国語 (zh)、ドイツ語 (de)、イタリア語 (it) - src/components/BlogPage/blogData.content.ts - demo-page       - フランス語 (fr)、イタリア語 (it)                                         - src/components/DemoPage/demo.content.ts - locale-switcher - イタリア語 (it)、ポルトガル語 (pt)                                       - src/components/LocaleSwitcher/localeSwitcher.content.tsロケール: 英語 (en)、ロシア語 (ru)、日本語 (ja)、フランス語 (fr)、韓国語 (ko)、中国語 (zh)、スペイン語 (es)、ドイツ語 (de)、アラビア語 (ar)、イタリア語 (it)、英国英語 (en-GB)、ポルトガル語 (pt)、ヒンディー語 (hi)必須ロケール: 英語 (en)欠落しているロケール: 日本語 (ja)、韓国語 (ko)、中国語 (zh)、ドイツ語 (de)、イタリア語 (it)、フランス語 (fr)、ポルトガル語 (pt)欠落している必須ロケール: なし合計欠落ロケール数: 7合計欠落必須ロケール数: 0

    CLIの詳細オプションについては、CLIドキュメントをご覧ください: CLIリファレンス → 「欠落翻訳のテスト」。また、テストガイドも参照してください。


    新機能: 欠落翻訳を補完するグローバルautoFill

    今後は、欠落翻訳がある辞書を自動的に補完するために、グローバルでauto-fillを有効にできます。

    intlayer.config.ts
    import { type IntlayerConfig, Locales } from "intlayer";const config: IntlayerConfig = {  internationalization: {    locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH],    defaultLocale: Locales.ENGLISH,    requiredLocales: [Locales.ENGLISH, Locales.FRENCH],  },  content: {    // すべての辞書の不足している翻訳を自動生成します    autoFill: "./{{fileName}}.content.ts",    //    // autoFill: "/messages/{{locale}}/{{key}}/{{fileName}}.content.json",    //    // autoFill: true, // "./{{fileName}}.content.json" を使用するようにすべての辞書の不足翻訳を自動生成    //    // autoFill: {    //   en: "./{{fileName}}.en.content.json",    //   fr: "./{{fileName}}.fr.content.json",    //   es: "./{{fileName}}.es.content.json",    // },  },};export default config;

    コンテンツファイルの autoFill フィールドを使用して、辞書ごとに微調整を行うことも可能です。詳細は doc/autoFill および doc/dictionary/content_file を参照してください。


    fill コマンド: より安全なデフォルト設定

    fill コマンドは現在、デフォルトで不足している翻訳のみを埋め、既存のコンテンツはスキップします。

    bash
    npx intlayer fill
    bash
    Affected dictionary keys for processing: access-key-creation-form-schema, doc-search-metadata, doc-search-page  - [access-key-creation-form-schema]      辞書にファイルパスがありません。スキップします。  - [access-key-creation-form-schema]      コンテンツ宣言を処理中: src/components/Dashboard/ProjectForm/AccessKey/useAccessKeyCreationFormSchema.content.ts  - [access-key-creation-form-schema]      埋めるロケールがありません - 辞書をスキップします  - [doc-search-metadata]                  辞書にファイルパスがありません。スキップします。  - [doc-search-metadata]                  コンテンツ宣言を処理中: src/app/[locale]/(docs)/doc/search/metadata.content.ts  - [doc-search-metadata]                  翻訳対象のロケールがありません - 辞書をスキップします  - [doc-search-page]                      辞書にファイルパスがありません。スキップします。  - [doc-search-page]                      コンテンツ宣言を処理中: src/app/[locale]/(docs)/doc/search/page.content.ts  - [doc-search-page]                     [ロシア語 (ru)]                   英語 (en) からロシア語 (ru) への辞書翻訳を準備中[intlayer]  src/app/[locale]/(docs)/doc/search/page.content.ts に Prettier フォーマットを適用しました  - [doc-search-page]                      コンテンツ宣言が src/app/[locale]/(docs)/doc/search/page.content.ts に書き込まれました

    CIの例はCI/CDで利用可能です。


    更新されたVS Code拡張機能

    この拡張機能には、Activity Barに専用のIntlayerタブが追加され、いくつかのワークフロー改善が含まれています:

    • 2つのビューを持つIntlayer Activity Bar:
      • ライブ辞書/コンテンツ検索用の検索Webビュー(intlayer.searchBar
      • 環境、辞書、寄稿ファイルを一覧表示する辞書ツリー(intlayer.dictionaries
    • 辞書ビューのツールバー:ビルド、プル、プッシュ、フィル、更新、テスト、辞書ファイル作成
    • コンテキストメニュー:辞書に対するプル/プッシュ;ファイルに対するフィル
    • 自動表示: 現在のエディタファイルが該当する場合、辞書ツリーでハイライトされます
    • コマンドパレットから利用可能な新コマンド: Fill Dictionaries と Test Dictionaries

    詳細は公式VS Code拡張機能のドキュメントをご覧ください。


    パフォーマンス: 10倍高速化

    • ローカルおよびリモート辞書の並列解決
    • アプリ起動時の再取得を避けるためリモート辞書をキャッシュ
    bash
    npx intlayer build

    出力:

    bash
    [intlayer]  Intlayerを準備中 (v6.0.1)[intlayer]  辞書:[intlayer]  ✓ ローカルコンテンツ: 163/163[intlayer]  ✓ リモートコンテンツ: 100/100[intlayer]   - access-key-creation-form             [local: ✔ built] [distant: ✔ imported][intlayer]   - access-key-creation-form-schema      [local: ✔ ビルド済み] [distant: ✔ インポート済み][intlayer]   - access-key-form                      [local: ✔ ビルド済み] [distant: ✔ インポート済み][intlayer]   - ai-ab-testing-section                                 [distant: ✔ インポート済み][intlayer]   - application-not-running-view         [local: ✔ ビルド済み] [distant: ✔ インポート済み][intlayer]   - application-template-message         [local: ✔ ビルド済み] [distant: ✔ フェッチ済み][intlayer]   - aside-navigation                     [local: ✔ ビルド済み] [distant: ✔ インポート済み][intlayer]   - ask-reset-password                   [local: ✔ ビルド済み] [distant: ✔ インポート済み][intlayer]   - ask-reset-password-schema            [local: ✔ ビルド済み] [distant: ✔ インポート済み][intlayer]   - autocompletion-section               [local: ✔ built] [distant: ✔ fetched][intlayer]   - available-techno-section             [local: ✔ built] [distant: ✔ imported][intlayer]   - blog-data                            [local: ✔ built][intlayer]   - blog-metadata                        [local: ✔ built][intlayer]   - blog-nav-list                        [local: ✔ built] [distant: ✔ imported][intlayer]   - blog-page                                             [distant: ✔ fetched][intlayer]   - blog-search-metadata                 [local: ✔ built] [distant: ✔ imported][intlayer]   - blog-search-page                     [local: ✔ built] [distant: ✔ imported]...[intlayer]  コンテンツが読み込まれました  (合計: 8401ms - ローカル: 4050ms - リモート: 4222ms)

    ロギングの改善

    ビルドおよびランタイム変換中に何が起きているかについて、より詳細な情報を提供するためにログシステムが改善されました。

    ビルドおよびランタイム変換中に何が起きているかをよりよく理解するために、詳細なログを有効にしてください。

    intlayer.config.ts
    export default {  log: {    mode: "verbose", // オプション: "default" | "verbose" | "disabled"  },};

    すべてのログオプションについては、Configuration を参照してください。


    より強力なバリデーション

    辞書の処理はより堅牢なバリデーションを実行するようになりました。辞書の処理に失敗した場合でも、Intlayerはアプリケーションのクラッシュを防ぎ、対処可能なエラーを表示します。


    CMSによるライブアップデート(本番環境対応)

    本番環境でアプリケーションを再ビルドすることなく、ライブコンテンツの更新(例:編集更新)を提供します。

    1. ライブインポートモードを有効にします:
    intlayer.config.ts
    import { type IntlayerConfig } from "intlayer";const config: IntlayerConfig = {  build: {    importMode: "live", // "static" | "dynamic" | "live"  },  editor: {    liveSync: true, // サーバー側でライブ同期を有効にする  },};export default config;
    1. アプリを実行し、ライブ処理を並行して行います:
    bash
    npx intlayer live --process 'vite preview'

    注意:

    • ライブモードを使用するようにフラグが立てられた辞書のみがライブで取得されます。他はパフォーマンス最適化されています。
    • ライブAPIに接続できない場合は、動的インポートにフォールバックします。

    完全なガイダンスについては、CMSとライブ同期および設定を参照してください。


    マイグレーションノート

    • 削除された項目: dictionaryOutput(以前は i18next または next-intl)。これは将来のバージョンでプラグイン可能なアダプターとして復活します。設定からこのフィールドを削除してください。
    • 関連削除: i18nextResourcesDirdoc/configuration の変更履歴を参照)。
    • 新しいグローバルオプション content.autoFill を使用して、大規模な翻訳不足を生成することを推奨します。
    • 翻訳不足のPRを制御するために npx intlayer content test を使用してください。
    • 詳細な診断を行うには、log.mode = 'verbose' を設定してください。

    修正点

    • Vue.js 統合の安定性向上
    • Lynx アダプターの改善
    • Windows上のビジュアルエディター

    便利なリンク

    Intlayerの今後のリリースに関する通知を受け取る