CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/maven-com-vaadin--vaadin-maven-plugin

Maven plugin for Vaadin Flow applications that handles frontend resource management, webpack bundling, and development workflow automation

Overview
Eval results
Files

frontend-cleanup.mddocs/

Frontend Cleanup

The clean-frontend and dance goals reset the frontend development environment by removing generated files and dependencies.

Goal Configuration

<goal>clean-frontend</goal>
<!-- Alternative Easter egg goal -->
<goal>dance</goal>
<!-- Default phase: pre-clean -->

Both goals perform identical cleanup operations. The dance goal is a playful alias for clean-frontend.

Purpose

These goals clean the frontend environment by removing:

  • node_modules directory
  • pnpm-lock.yaml file
  • package-lock.json file
  • Vaadin dependencies from package.json
  • Generated frontend folders
  • Build artifacts and temporary files

Usage Examples

Basic Cleanup

<plugin>
  <groupId>com.vaadin</groupId>
  <artifactId>vaadin-maven-plugin</artifactId>
  <version>24.9.0</version>
  <executions>
    <execution>
      <goals>
        <goal>clean-frontend</goal>
      </goals>
    </execution>
  </executions>
</plugin>

Integration with Maven Clean Lifecycle

<plugin>
  <groupId>com.vaadin</groupId>
  <artifactId>vaadin-maven-plugin</artifactId>
  <version>24.9.0</version>
  <executions>
    <execution>
      <phase>pre-clean</phase>
      <goals>
        <goal>clean-frontend</goal>
      </goals>
    </execution>
  </executions>
</plugin>

Using the Easter Egg Goal

<execution>
  <goals>
    <goal>dance</goal>  <!-- Same as clean-frontend but more fun! -->
  </goals>
</execution>

Cleanup Operations

Files and Directories Removed

project-root/
├── node_modules/           (entire directory)
├── pnpm-lock.yaml         (if using pnpm)
├── package-lock.json      (if using npm)
├── yarn.lock              (if using yarn)
└── src/main/frontend/
    └── generated/         (generated files)

Package.json Cleanup

The goal removes Vaadin-specific dependencies from package.json:

  • Dependencies added by @NpmPackage annotations
  • Generated script entries
  • Build tool configurations
  • Vaadin-specific metadata

Original user-defined dependencies remain intact.

Command Line Execution

# Standard cleanup
mvn flow:clean-frontend

# Easter egg cleanup (same functionality)
mvn flow:dance

# Full clean with Maven lifecycle
mvn clean  # (if plugin configured in pre-clean phase)

# Force cleanup even with errors
mvn flow:clean-frontend -Dvaadin.ignoreErrors=true

When to Use Cleanup Goals

Development Issues

Use cleanup when experiencing:

  • Dependency resolution conflicts
  • Outdated or corrupted node_modules
  • Build tool version mismatches
  • Stale generated files causing errors

Workflow Scenarios

# Reset after major dependency changes
mvn flow:clean-frontend
mvn flow:prepare-frontend

# Clean CI/CD pipeline
mvn flow:clean-frontend
mvn flow:build-frontend -Dvaadin.ciBuild=true

# Switch package managers
mvn flow:clean-frontend
# Configure plugin for different package manager (pnpm/npm)
mvn flow:prepare-frontend

Integration with Other Goals

Clean -> Prepare -> Build Workflow

<plugin>
  <groupId>com.vaadin</groupId>
  <artifactId>vaadin-maven-plugin</artifactId>
  <version>24.9.0</version>
  <executions>
    <execution>
      <id>clean-frontend</id>
      <phase>pre-clean</phase>
      <goals>
        <goal>clean-frontend</goal>
      </goals>
    </execution>
    <execution>
      <id>prepare-frontend</id>
      <phase>process-resources</phase>
      <goals>
        <goal>prepare-frontend</goal>
      </goals>
    </execution>
    <execution>
      <id>build-frontend</id>
      <phase>process-classes</phase>
      <goals>
        <goal>build-frontend</goal>
      </goals>
    </execution>
  </executions>
</plugin>

Conditional Cleanup

Use Maven profiles for conditional cleanup:

<profiles>
  <profile>
    <id>clean-frontend</id>
    <activation>
      <property>
        <name>clean.frontend</name>
      </property>
    </activation>
    <build>
      <plugins>
        <plugin>
          <groupId>com.vaadin</groupId>
          <artifactId>vaadin-maven-plugin</artifactId>
          <version>24.9.0</version>
          <executions>
            <execution>
              <goals>
                <goal>clean-frontend</goal>
              </goals>
            </execution>
          </executions>
        </plugin>
      </plugins>
    </build>
  </profile>
</profiles>

Activate with:

mvn compile -Pclean-frontend
# or
mvn compile -Dclean.frontend=true

Troubleshooting

Permission Issues

Error: Cannot delete files in node_modules
Solution: Ensure proper file permissions, run as administrator if needed on Windows

Locked Files

Error: Cannot delete locked files
Solution: Stop development server, close IDE, ensure no processes are using node_modules

Partial Cleanup

Warning: Some files could not be removed
Solution: Manually remove problematic files/directories, check for file system issues

Advanced Cleanup Scenarios

Corporate Development

In corporate environments with restricted file systems:

<configuration>
  <!-- Clean to temporary directory first -->
  <tempCleanupDirectory>${java.io.tmpdir}/vaadin-cleanup</tempCleanupDirectory>
</configuration>

Multi-Module Projects

For Maven multi-module projects:

# Clean all modules
mvn flow:clean-frontend -pl .,module1,module2

# Clean only specific modules
mvn flow:clean-frontend -pl frontend-module

Automated Cleanup in CI/CD

#!/bin/bash
# CI cleanup script
mvn flow:clean-frontend || true  # Continue on errors
rm -rf node_modules pnpm-lock.yaml package-lock.json  # Force cleanup
mvn flow:prepare-frontend
mvn flow:build-frontend -Dvaadin.ciBuild=true

The "Dance" Goal Easter Egg

The dance goal is identical to clean-frontend but adds a playful element to the build process. It was added as an Easter egg for developers who prefer more colorful build commands:

mvn flow:dance  # ✨ Same as clean-frontend but with more style! ✨

This is a hidden feature mentioned in the source code comments as "This is the hidden vaadin:dance to clean up the frontend files."

Install with Tessl CLI

npx tessl i tessl/maven-com-vaadin--vaadin-maven-plugin

docs

code-migration.md

frontend-cleanup.md

frontend-development.md

index.md

production-build.md

sbom-generation.md

tile.json