logo

パレット - カラフルに🎨

Palette — ビジュアルページビルダー、デザインの専門知識は不要です。

ライブデモ パレットをダウンロード

Scroll

コンパイル済みTwigテンプレートのデバッグ

04/05/2020, by maria

Menu

Twigの通常の動作

デフォルトでは、TwigテーマエンジンはテンプレートをPHPコードにコンパイルし、コンパイルされたコードをメモリに保存します。コンパイルされたコードは、Twigテンプレートへの変更がDrupalサイトにすぐに反映されないため、開発には適していません。

Twigがマークアップを生成した後、Render APIに別のキャッシュ層があります。これはTwigが生成したマークアップを取得してキャッシュするため、後続のページリクエストではTwigはまったく関与せず、Twigのデバッグオプションは最終的に無視されます。

Drupalのキャッシュクリアインターフェースを使用してキャッシュをクリアできますが、開発を進めるには、TwigもRender APIも何もキャッシュしないようにDrupalの設定を変更する方が簡単です。

デバッグ用のTwigとRender APIの設定

TwigとRenderの2つのAPI層は、デバッグ目的で個別に設定する必要があります:

1. Twigエンジンは、デバッグ、テンプレートの自動再読み込み(再コンパイル)、ファイルシステムへのコンパイル済みテンプレートのキャッシュを設定するためのオプションを提供します。これはサイトのservices.ymlで設定できます。
2. レンダリングAPIのキャッシュは、サイトのsettings.phpファイルで設定できます。

以下でこれらの2つの手順を詳しく説明します。

1. デバッグ用のTwigの設定

これにはDrupal Consoleを使用できます。または手動で変更を加えます。

Drupal Consoleを使用してデバッグを有効にする方法

まずDrupal Consoleをインストールします。次に次を実行します:

drupal site:mode dev 

これにより多くの設定が変更されますが、sites/default/services.ymlの次の値を変更することも含まれます:

twig.config: { debug: true } 

次のようなものが表示されるはずです:

output_3

手動でデバッグを有効にする方法

1. サイトのservices.ymlファイルを見つけます。おそらくsites/default/services.ymlにあります
2. services.ymlがまだ存在しない場合は、default.services.ymlをコピーしてservices.ymlに名前を変更します。
3. services.ymlファイルを編集し、以下で定義されている1つ以上のデバッグオプションを有効にします:
           - Twigのデバッグオプション
           - Twigの自動再読み込み
           - Twigキャッシュ
4. キャッシュを再構築します。

services.ymlでtwig.configパラメータを見つけて変更を加えます。例:

parameters:
  twig.config:
    debug: true 

Twigのデバッグオプション

注:本番環境では設定しないでください! これらの3つのパラメータは、本番環境では設定しないまま(つまりデフォルトのまま)にする必要があります。

- debug(デフォルト:false)

debug: trueが設定されている場合:

  • 各Twigテンプレートのマークアップは、テンプレートファイル名の候補などのテーマ情報を含むHTMLコメントで囲まれています。
  • このデバッグマークアップにより、レンダリングされたHTMLを直接検査する自動テストが失敗することに注意してください。自動テストを実行するときは、twig_debugをFALSEに設定する必要があります。
  • dump()関数は、テンプレート変数に関する情報を出力するためにTwigテンプレートで使用できます。
  • Twigテンプレートは、ソースコードが変更されると自動的に再コンパイルされます(下のauto_reloadを参照)。

- auto_reload(デフォルト:null、上記のdebugによって決定されます)

auto_reload: trueが設定されている場合

  • ソースコードが変更されるたびにTwigテンプレートを自動的に再コンパイルします。twig_auto_reloadに値を指定しない場合、twig_debugの値に基づいて決定されます。
  • 特にauto_reloadを望まず、デバッグもしたくない場合は、このパラメータを変更する必要はありません。上のdebugを有効にするだけです。

- cache(デフォルト:true、ただし上記のdebugによって上書きされます)

cache: falseが設定されている場合:

  • 特定のユースケースがない限り、Twigキャッシュを無効にしないでください。Twigデバッグを有効にすると(または何らかの理由でデバッグを有効にしたくない場合はauto_reloadだけを)、Twigキャッシュは邪魔になりません。Twigキャッシュを無効にすると、編集されたかどうかに関係なく各テンプレートをコンパイルする必要があるため、開発が遅くなります。さらに、ディスクにキャッシュされていない場合、コンパイル済みのTwigテンプレート(デフォルトではsites/default/files/php/twigにあるPHPクラス)を簡単に表示したりデバッグしたりできません。
  • デフォルトでは、パフォーマンスを向上させるためにTwigテンプレートがコンパイルされ、ファイルシステムに保存されます。Twigキャッシュを無効にすると、テンプレートが使用されるたびにソースコードから再コンパイルされます。ほとんどの場合、Twigキャッシュを無効にするのではなく、上記のtwig_auto_reload設定を有効にする必要があります。

 

2. デバッグ用のRender APIキャッシュの設定

デフォルトでは、Drupalは後続のページ読み込みを高速化するために、ブロックとエンティティのレンダリングをキャッシュします。つまり、それらのTwigテンプレートへの変更はすぐには反映されません。レンダリングキャッシュをnullキャッシュバックエンドを使用するように設定すると、これが効果的に無効になります。

レンダリングキャッシュを無効にするには、次の行を追加します:

  • settings.php(本番サイトには追加しないように注意してください)
  • または、settings.phpの下部にある行を最初にコメント解除してsettings.local.php。

これらの行:

$settings['container_yamls'][] = DRUPAL_ROOT . '/sites/development.services.yml';
$settings['cache']['bins']['render'] = 'cache.backend.null';
$settings['cache']['bins']['dynamic_page_cache'] = 'cache.backend.null'; 

settings.phpファイルにすでにコメントアウトされた状態で存在する場合があります。その場合は、コメントを解除するだけです(ただし、後で忘れずにコメントアウトしてください!)

完了です!

TwigとRender APIの設定が完了したら、すべてのキャッシュをクリアします:Drushを使用するか、[構成] -> [パフォーマンス]に移動して[すべてのキャッシュをクリア]ボタンをクリックします。

最後に、確認しているページを更新します:ページのソースにTwigデバッグ情報が表示され、Twigテンプレートの更新は更新されたページにすぐに反映されるはずです。