Figma│ライブラリ化コンポーネントが反映されない時の原因と対処法

Figmaでデザイン作業を効率化するために、コンポーネントをライブラリ化して運用するケースは多くあります。

しかし、ライブラリが二重構成（パーツ単位のライブラリと、それを組み合わせたレイアウトライブラリ）になっている場合、最新の変更が反映されないトラブルが発生することがあります。

反映されない原因と具体的な解決手順を解説します。

トラブルが発生する構成

• ライブラリA：ボタンや入力欄など、パーツ単位のメインコンポーネント
• ライブラリB：ライブラリAのパーツを配置して作成した、レイアウト（フォームやカードなど）のメインコンポーネント
• 画面デザインファイル：ライブラリBのインスタンスを配置して画面を構成

この構成で変更が反映されない場合は、どのファイルで更新が止まっているかを確認します。

入れ子にしただけで必ず不具合が起きるという意味ではありません。

反映されない原因

公開されたライブラリの変更は、利用先で内容を確認して適用する必要があります。

中間のライブラリBが古い状態を含んでいる場合は、B側で更新を受け取り、必要な変更を公開したか確認してください。

解決手順

次の順に、変更の公開と受け取りを確認します。

更新対象のないファイルを、理由なく再公開する必要はありません。

1. ライブラリA（パーツ）：コンポーネントを修正してライブラリを公開（Publish）
2. ライブラリB（レイアウト）：ファイルを開いてライブラリAの更新を確認・適用し、Bに公開すべき変更がある場合に再公開
3. 画面デザインファイル：ライブラリBの更新通知を受け取って反映

運用のポイント

• ライブラリのネスト（入れ子）が深くなると更新手順が複雑化するため、パーツのみをライブラリ化し、組み合わせは画面ファイル側で行う構成にすると管理が簡潔になります。
• チーム開発では「共通パーツのみをライブラリ化し、複合コンポーネントは各プロジェクトファイル内で作成する」といった運用ルールを定めておくと更新漏れを防げます。

ライブラリの入れ子は共通部品を管理するために有効です。

分割数を減らす方法は選択肢の一つであり、更新担当と依存関係を把握できる構成を選んでください。

Figmaの他の操作や活用法は、一覧記事から確認できます。

インスタンスの差し替え手順は以下の記事で解説しています。

Figmaで思いどおりにならないときの対処は、ほかにも書いています。

まとめ

変更が反映されないときは、公開元と利用先の更新状態を順に確認します。

反映されないときは、「依存元のライブラリから順に開いて公開する」手順を確認してください。

更新を受け取っても一部だけ変わらない場合は、インスタンスのオーバーライド、切り離し、参照するメインコンポーネントの違いも確認してください。