Tailwindcss V4

jhipster · Jan 25, 2025 · b3bc5bd · b3bc5bd
1 parent 8e62a02
commit b3bc5bd
Show file tree

Hide file tree

Showing 5 changed files with 23 additions and 22 deletions.
diff --git a/.../tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactory.java b/.../tech/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactory.java
@@ -1,15 +1,6 @@
 package tech.jhipster.lite.generator.client.react.security.jwt.domain;
 
-import static tech.jhipster.lite.module.domain.JHipsterModule.LINE_BREAK;
-import static tech.jhipster.lite.module.domain.JHipsterModule.from;
-import static tech.jhipster.lite.module.domain.JHipsterModule.lineBeforeRegex;
-import static tech.jhipster.lite.module.domain.JHipsterModule.lineBeforeText;
-import static tech.jhipster.lite.module.domain.JHipsterModule.moduleBuilder;
-import static tech.jhipster.lite.module.domain.JHipsterModule.packageName;
-import static tech.jhipster.lite.module.domain.JHipsterModule.path;
-import static tech.jhipster.lite.module.domain.JHipsterModule.regex;
-import static tech.jhipster.lite.module.domain.JHipsterModule.text;
-import static tech.jhipster.lite.module.domain.JHipsterModule.to;
+import static tech.jhipster.lite.module.domain.JHipsterModule.*;
 import static tech.jhipster.lite.module.domain.npm.JHLiteNpmVersionSource.COMMON;
 import static tech.jhipster.lite.module.domain.npm.JHLiteNpmVersionSource.REACT;
 
@@ -57,12 +48,11 @@ public JHipsterModule buildModule(JHipsterModuleProperties properties) {
         .addDependency(packageName("@nextui-org/react"), REACT)
         .addDevDependency(packageName("autoprefixer"), COMMON)
         .addDevDependency(packageName("sass"), REACT)
-        .addDevDependency(packageName("postcss"), COMMON)
+        .addDevDependency(packageName("@tailwindcss/vite"), COMMON)
         .addDevDependency(packageName("tailwindcss"), COMMON)
         .and()
       .files()
         .batch(ROOT, to("."))
-          .addFile("postcss.config.js")
           .addFile("tailwind.config.js")
           .and()
         .add(APP_SOURCE.template("common/services/storage.ts"), COMMON_DESTINATION.append("services/storage.ts"))
@@ -87,6 +77,10 @@ public JHipsterModule buildModule(JHipsterModuleProperties properties) {
         .add(TEST_JAVASCRIPT_SOURCE.template("common/services/storage.test.ts"), TEST_DESTINATION.append("common/services/storage.test.ts"))
         .and()
       .mandatoryReplacements()
+        .in(path("vite.config.ts"))
+          .add(lineAfterRegex("from 'vite';"), "import tailwindcss from '@tailwindcss/vite';")
+          .add(text("plugins: [react(), "), "plugins: [react(), tailwindcss(), ")
+          .and()
         .in(path("src/main/webapp/app/home/infrastructure/primary/HomePage.tsx"))
           .add(lineBeforeText("function HomePage() {"), "import LoginForm from '@/login/primary/loginForm';" + LINE_BREAK)
           .add(LOGIN_FORM_MATCHER, properties.indentation().times(4) + "<LoginForm />")
@@ -103,7 +97,7 @@ public JHipsterModule buildModule(JHipsterModuleProperties properties) {
           )
           .and()
         .in(path("src/main/webapp/app/index.css"))
-          .add(lineBeforeText("body {"), "@tailwind base;" + LINE_BREAK + "@tailwind components;" + LINE_BREAK + "@tailwind utilities;" + LINE_BREAK)
+          .add(lineBeforeText("body {"), "/* @config '../../../../tailwind.config.js'; */" + LINE_BREAK + "@import 'tailwindcss';" + LINE_BREAK)
         .and()
       .and()
       .optionalReplacements()

diff --git a/src/main/resources/generator/client/react/security/jwt/postcss.config.js b/src/main/resources/generator/client/react/security/jwt/postcss.config.js
diff --git a/src/main/resources/generator/dependencies/common/package.json b/src/main/resources/generator/dependencies/common/package.json
@@ -8,6 +8,7 @@
     "@playwright/test": "1.49.1",
     "@prettier/plugin-pug": "3.2.0",
     "@prettier/plugin-xml": "3.4.1",
+    "@tailwindcss/vite": "4.0.0",
     "@tikui/core": "6.3.0",
     "@tsconfig/recommended": "1.0.8",
     "@types/jest": "29.5.14",
@@ -51,7 +52,7 @@
     "stylelint-config-concentric-order": "5.2.0",
     "stylelint-config-standard-scss": "14.0.0",
     "stylelint-order": "6.0.4",
-    "tailwindcss": "3.4.17",
+    "tailwindcss": "4.0.0",
     "tikuidoc-tikui": "8.0.1",
     "ts-jest": "29.2.5",
     "typescript": "5.7.3",

diff --git a/...h/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactoryTest.java b/...h/jhipster/lite/generator/client/react/security/jwt/domain/ReactJwtModuleFactoryTest.java
@@ -20,7 +20,15 @@ class ReactJwtModuleFactoryTest {
   void shouldBuildModule() {
     JHipsterModule module = factory.buildModule(properties());
 
-    JHipsterModuleAsserter asserter = assertThatModuleWithFiles(module, packageJsonFile(), app(), appCss(), indexTsx(), indexCss());
+    JHipsterModuleAsserter asserter = assertThatModuleWithFiles(
+      module,
+      packageJsonFile(),
+      app(),
+      appCss(),
+      indexTsx(),
+      indexCss(),
+      viteReactConfigFile()
+    );
 
     assertReactApp(asserter);
     asserter
@@ -71,7 +79,7 @@ private void assertReactApp(JHipsterModuleAsserter asserter) {
     asserter
       .hasFile("package.json")
       .containing(nodeDependency("autoprefixer"))
-      .containing(nodeDependency("postcss"))
+      .containing(nodeDependency("@tailwindcss/vite"))
       .containing(nodeDependency("tailwindcss"))
       .containing(nodeDependency("react-hook-form"))
       .containing(nodeDependency("axios"))

diff --git a/...st/java/tech/jhipster/lite/module/infrastructure/secondary/JHipsterModulesAssertions.java b/...st/java/tech/jhipster/lite/module/infrastructure/secondary/JHipsterModulesAssertions.java
@@ -75,6 +75,10 @@ public static ModuleFile vitestConfigFile() {
     return file("src/main/resources/generator/typescript/vitest.config.ts.mustache", "vitest.config.ts");
   }
 
+  public static ModuleFile viteReactConfigFile() {
+    return file("src/main/resources/generator/client/react/core/vite.config.ts.mustache", "vite.config.ts");
+  }
+
   public static ModuleFile eslintConfigFile() {
     return file("src/main/resources/generator/typescript/eslint.config.js.mustache", "eslint.config.js");
   }