Thymeleaf
Thymeleaf は、ウェブおよびスタンドアロン環境の両方に対応したサーバーサイド Java テンプレートエンジンです。 主な目的は、自然なテンプレートを開発ワークフローにもたらすことです。これは、ブラウザーで正しく表示されるだけでなく、静的プロトタイプとしても機能する HTML です。
構文ハイライトは、Ultimate サブスクリプションなしの IntelliJ IDEA でも利用できます。
Thymeleaf プラグインが有効になっていることを確認する
設定 ダイアログ(Ctrl+Alt+S )で プラグイン | インストール済み を選択します。
Thymeleaf プラグインの横にあるチェックボックスが選択されていることを確認してください。
それ以外の場合は、チェックボックスを選択してプラグインを有効にします。
変更を適用して、ダイアログを閉じます。 プロンプトが表示されたら、IDE を再起動します。
詳細については、 プラグインをインストールする を参照してください。
Thymeleaf サポートの追加
プロジェクトまたはモジュールを作成するとき、または既存のプロジェクトまたはモジュールに対して、Thymeleaf サポートを追加できます。 IntelliJ IDEA は、選択した Thymeleaf ライブラリファイルをダウンロードし、対応するモジュールの依存関係に追加します。
適切な pom.xml ファイルを開いて Thymeleaf プロジェクトを作成することもできます。 この場合、Maven はプロジェクト内の依存関係を管理します。 詳細については、 Maven を参照してください。
Thymeleaf を使用した新しい Java Enterprise プロジェクトまたはモジュール
メインメニューで、 または に移動します。
開いたダイアログで、左側のリストから Jakarta EE を選択し、 次へ(N) をクリックします。
依存関係 リストの 実装 で、 Thymeleaf を選択し、 次へ(N) をクリックします。
プロジェクトまたはモジュールの名前を入力し、 完了(F) をクリックします。
Java エンタープライズプロジェクトの詳細については、 チュートリアル: 最初の Jakarta EE アプリケーション を参照してください。
Thymeleaf を使用した新しい Spring プロジェクトまたはモジュール
または に進みます。
開いたダイアログで、左側のリストから Spring Initializr を選択し、 次へ(N) をクリックします。
依存関係 リストから「テンプレートエンジン 」をクリックし、「Thymeleaf 」オプションを選択します。

作成 をクリックします。
Spring プロジェクトの詳細については、「チュートリアル: 最初の Spring アプリケーションを作成する 」を参照してください。
既存のプロジェクトに Thymeleaf を追加する
ビルドファイルをエディターで開きます(プロジェクトで使用するビルドツールに応じて、 pom.xml または build.gradle )。
次の依存関係を追加しますが、バージョンがプロジェクト全体と一致していることを確認してください。
<dependency> <groupId>org.thymeleaf</groupId> <artifactId>thymeleaf</artifactId> <version>3.0.12.RELEASE</version> </dependency>implementation('org.thymeleaf:thymeleaf:3.0.12.RELEASE')Ctrl+Shift+O を押して変更をインポートします。
Thymeleaf サポート機能
IntelliJ IDEA での Thymeleaf(英語) のサポートには、次のものが含まれます。
- コード補完
式や
th:*属性に対する コード補完が利用できます。- 参照からのナビゲーション
テンプレート内の参照から、対応する getter メソッドや .properties ファイル内のメッセージ、またはその他の適切なコード箇所へナビゲーションできます。 に移動するか、 Ctrl+B を押します。
- 型定義へのナビゲーション
に移動するか、 Ctrl+Shift+B を押します。
- リファクタリング
参照されているプロパティや getter メソッド、反復やステータス変数などに対して、 名前の変更 リファクタリングを実行できます。 に移動するか、 Shift+F6 を押します。
- インスペクション
式構文の未解決の参照とエラーを見つけて修正するのに役立つ コードインスペクション。
- インテンションアクション
インテンションアクション (例: 未解決メッセージ参照に対する プロパティの作成 や、
org.thymeleaf.*クラスへのインポートステートメント追加の クラスのインポート など)が利用できます。- プロトタイプのプレビュー
プロトタイプのプレビュー (テンプレートの静的部分)をエディターからウェブブラウザーで表示します。
ブラウザーで Thymeleaf プロトタイプをプレビューする
IntelliJ IDEA を 使用すると、通常の HTML ファイルと同じように、テンプレートの静的部分を Web ブラウザーまたは組み込みプレビューでプレビューできます。

テンプレート内の動的なデータをプレビューする場合は、アプリケーションを実行する必要があります。 以下の例では、シンプルな Thymeleaf テンプレートを作成し、それを Spring MVC アプリケーションのビューとして使用します。
Thymeleaf テンプレートを作成する
Thymeleaf サポートの追加 の説明に従って、Thymeleaf を使用して新しい Spring Boot プロジェクトを作成し、
demoという名前を付けます。プロジェクト ツールウィンドウ(Alt+1 )で、 src|main|java にある
demoパッケージを右クリックし、 を選択します。クラスに
MyFirstAppという名前を付けます。
新しいクラスにコントローラーを追加します。例:
package org.example.demo; import org.springframework.ui.Model; import org.springframework.stereotype.Controller; import org.springframework.web.bind.annotation.RequestMapping; import java.util.Arrays; @Controller public class MyFirstApp { @RequestMapping("/home") public String index(Model model) { model.addAttribute("message", "Hello Thymeleaf"); model.addAttribute("items", Arrays.asList("Item 1", "Item 2", "Item 3")); return "start_page"; } }resources ディレクトリに、
templatesという名前のディレクトリを作成します。templatesで、start_pageという名前の HTML ファイルを作成します。このテンプレートは、
${message}および${items}変数 (以前に追加したコントローラーで渡されます) と、日付を処理するために使用される#datesThymeleaf オブジェクトを使用します。<!DOCTYPE HTML> <html lang=""> <head> <title>Hello</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> </head> <body> <h1 th:text="${message}"></h1> <p>Thymeleaf Iteration:</p> <ul> <li th:each="item : ${items}" th:text="${item}"></li> </ul> <p th:text="'Current Year: ' + ${#dates.format(#dates.createNow(), 'yyyy')}"></p> </body> </html>
IntelliJ IDEA はテンプレートを認識し、 Ctrl+B を押すことで変数からそれらが宣言されているコントローラーコードに移動できるようにします。
コントローラーからテンプレートへもナビゲーションできます。 MyFirstApp.java で、ガター内の をクリックし、 関連ビューに移動 を選択します。
start_page は下線付きのリンクとして表示されており、これは IntelliJ IDEA がプロジェクト内の該当テンプレートを検出していることを示します。「Ctrl クリック」でこのリンクに移動できます(または Ctrl+B でテンプレートに移動します)。

テンプレートのプレビュー
アプリケーションの実行: Shift+F10 を押すか、ウィンドウヘッダー内の実行ウィジェットで DemoApplication が選択されていることを確認し、その横の
をクリックします。
ブラウザーで ローカルホスト: 8080/ ホームを開きます。
Spring は start_page テンプレートをレンダリングし、変数をその値に置き換えます。
