Problems with frontend generation

Problems with frontend generation

I’ve been having problems generating the frontend. I’m using the latest version, 24, or more precisely, I’m using 24.8.4.

The most common issue is when I create a new screen/class, for example. It doesn’t compile or load, even though it’s exactly the same as another one that already works (just changing the name).
Another example is adding a component like a TimePicker to a form that didn’t already have it. It simply doesn’t work.

I try everything:
mvn vaadin:prepare-frontend
mvn clean package -Pproduction
mvn clean package

Among several attempts.
And the strangest thing: suddenly it works. As time goes by, versions are generated, and suddenly it works.

But often it’s urgent. Right now, I have a new screen to deliver that makes a JavaScript call. Every other part of the system that has this is working, but this new screen doesn’t.

What should I do to actually recompile the entire frontend?

Are you deploying your application somewhere, using multiple maven modules or is it powered by spring boot? The former can be tricky… the latter should not need any special attention. Only thing you might wanna try is to disable development bundle by enabling hotdeploy

If the problem occurs only in production mode disable optimized bundle

I compile with mvn clean package -Pproduction.
This generates a jar.
This jar doesn’t work on this new screen; it doesn’t work where JavaScript is.

It doesn’t matter if I install this jar on my Mac or Linux.

If I run it via Intelij, it doesn’t work either.

Here’s a snippet of my POM:

jar



    <properties>
        <java.version>17</java.version>
        <vaadin.version>24.8.4</vaadin.version>
    </properties>

    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>3.5.3</version>
    </parent>





 <dependencyManagement>
        <dependencies>
            <dependency>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-bom</artifactId>
                <version>${vaadin.version}</version>
                <type>pom</type>
                <scope>import</scope>
            </dependency>
        </dependencies>
    </dependencyManagement>



The dependency of vaadin


        <dependency>
            <groupId>com.vaadin</groupId>
            <!-- Replace artifactId with vaadin-core to use only free components -->
            <artifactId>vaadin</artifactId>
        </dependency>
        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin-spring-boot-starter</artifactId>
        </dependency>

        <!-- Persistence -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-data-jpa</artifactId>
        </dependency>


        <!-- Additional Spring Dependencies -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-actuator</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-validation</artifactId>
        </dependency>
        <!--
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-security</artifactId>
        </dependency>-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <optional>true</optional>
        </dependency>

        <dependency>
            <groupId>com.vaadin</groupId>
            <artifactId>vaadin-spring-boot-starter</artifactId>
            <exclusions>
                <!-- Excluding so that webjars are not included. -->
                <exclusion>
                    <groupId>com.vaadin</groupId>
                    <artifactId>vaadin-core</artifactId>
                </exclusion>
            </exclusions>
        </dependency>


Then the build


<build>
        <!-- Change the default goal to spring-boot:test-run to start the application with Testcontainers and PostgreSQL -->
        <defaultGoal>spring-boot:run</defaultGoal>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <dependencies>
                    <dependency>
                        <groupId>org.springframework.boot.experimental</groupId>
                        <artifactId>spring-boot-thin-layout</artifactId>
                        <version>1.0.31.RELEASE</version>
                    </dependency>
                </dependencies>
            </plugin>
            <plugin>
                <groupId>com.diffplug.spotless</groupId>
                <artifactId>spotless-maven-plugin</artifactId>
                <version>2.44.4</version>
                <configuration>
                    <java>
                        <toggleOffOn/>
                        <eclipse>
                            <version>4.35</version>
                            <file>${project.basedir}/eclipse-formatter.xml</file>
                        </eclipse>
                    </java>
                    <typescript>
                        <includes>
                            <include>src/main/frontend/**/*.ts</include>
                            <include>src/main/frontend/**/*.tsx</include>
                        </includes>
                        <excludes>
                            <exclude>src/main/frontend/generated/**</exclude>
                        </excludes>
                        <prettier>
                            <prettierVersion>3.3.3</prettierVersion>
                            <configFile>${project.basedir}/.prettierrc.json</configFile>
                        </prettier>
                    </typescript>
                </configuration>
            </plugin>
            <plugin>
                <groupId>com.vaadin</groupId>
                <artifactId>vaadin-maven-plugin</artifactId>
                <version>${vaadin.version}</version>
                <executions>
                    <execution>
                        <goals>
                            <goal>prepare-frontend</goal>
                        </goals>
                    </execution>
                </executions>
            </plugin>
            <plugin>
                <groupId>org.apache.maven.plugins</groupId>
                <artifactId>maven-wrapper-plugin</artifactId>
                <version>3.3.2</version>
            </plugin>
        </plugins>
    </build>

    <profiles>
        <profile>
            <id>production</id>
            <dependencies>
                <dependency>
                    <!-- Exclude development dependencies from production -->
                    <groupId>com.vaadin</groupId>
                    <artifactId>vaadin-core</artifactId>
                    <exclusions>
                        <exclusion>
                            <groupId>com.vaadin</groupId>
                            <artifactId>vaadin-dev</artifactId>
                        </exclusion>
                    </exclusions>
                </dependency>
            </dependencies>
            <build>
                <plugins>
                    <plugin>
                        <groupId>com.vaadin</groupId>
                        <artifactId>vaadin-maven-plugin</artifactId>
                        <version>${vaadin.version}</version>
                        <executions>
                            <execution>
                                <goals>
                                    <goal>build-frontend</goal>
                                </goals>
                                <phase>compile</phase>
                            </execution>
                        </executions>
                    </plugin>
                </plugins>
            </build>
        </profile>
    </profiles>

Configure your vaadin-maven-plugin like described here

with:

forceProductionBuild=true

optimizeBundle=false

Note: if you don’t use commercial components replace the dependency to vaadin with vaadin-core like described in the comment.

That fixed it!

I ran:
mvn clean package -Pproduction -Dvaadin.force.production.build=true

Thank you so much!