admin管理员组

文章数量:1289911

I am using Spring boot application with Java template engine and when I did the setup for version 3, a tailwind config file was present to check for the JTE files as below

/** @type {import('tailwindcss').Config} */
module.exports = {
  content: ['../jte/**/*.jte'],
  theme: {
    extend: {},
  },
  plugins: [],
}

However, With the version 4 tailwind cli there is no configuration for the content files

The script is not picking up the CSS class used in the JTE files

package.json

  "scripts": {
    "build": "tailwindcss -i ./style.css -o ../resources/static/main.css --minify",
    "watch": "tailwindcss --watch -i ./style.css -o ../resources/static/main.css --watch"
  }

style.css

@import "tailwindcss";

Version 3 style.css

@tailwind base;
@tailwind components;
@tailwind utilities;

when the build command is run npm run build none of the tailwind CSS is working

login.jte

<form class="mt-8 space-y-6" action="/login" method="POST">
                ${csrfHiddenInput}
                
                    <div>
                        <label>User name</label>
                        <input name="username" type="text" required class="w-full px-4 py-2 border"/>
                    </div>
                    <div>
                        <label>Password</label>
                        <input name="password" type="password" required class="w-full px-4 py-2 border" />
                    </div>
                

                <div>
                    <button type="submit"
                            class="group relative w-full flex justify-center py-2 px-4 border border-transparent text-sm font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-indigo-500">
                        Sign in
                    </button>
                </div>
            </form>

Index.jte

@param gg.jte.Content content

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Spring Security Demo</title>
    <link rel="stylesheet" href="./main.css">
</head>
<body class="bg-gray-100">
${content}
</body>
</html>

None of the CSS are working.

本文标签: How to use tailwind css 4 with spring boot and Java template EngineStack Overflow