Docs

Documentation versions (currently viewingVaadin 25.1 (pre-release))

Source Control

Track and manage changes to the source code in a Vaadin project.

In addition to the standard directory layout of typical Java applications, Vaadin projects also include various files and folders related to the frontend tooling. A typical Vaadin application has a directory layout with something like the following content:

Source code
node_modules/                    (1)
src/
├── main/                        (2)
│   ├── bundles/                 (3)
│   │   ├── dev.bundle           (4)
│   │   └── prod.bundle          (5)
│   ├── frontend/                (6)
│   │   ├── generated/
│   │   └── index.html           (7)
│   ├── java/
│   └── resources/
│       └── META-INF/
│           └── resources/       (8)
└── test/                        (9)
target/
package.json                     (10)
package-lock.json                (11)
pom.xml                          (12)
tsconfig.json                    (13)
types.d.ts                       (14)
vite.config.ts                   (15)
vite.generated.ts                (16)
  1. A folder that caches the frontend modules upon which the project depends. This folder is auto-generated based on the contents of package.json and package-lock.json. This folder should not be added to source control.

  2. Application sources.

  3. Automatically generated folder containing the pre-compiled frontend files/resources for your project. .bundle files should be added to Version Control System and committed, so that other developers do not need to download and compile frontend files again.

  4. Compressed archive containing development time frontend files/resources.

  5. Compressed archive containing production time frontend files/resources.

  6. Frontend resources, like TypeScript and JavaScript files, are placed in this folder.

  7. index.html is an initially auto-generated file that defines the outermost structure of the application. This file can be added to source control, and should be if customized. For customization of index.html see Modifying the Application Shell.

  8. Static web resources such as images and stylesheets are placed in this folder.

  9. Test sources.

  10. package.json defines the version ranges of the frontend dependencies.

  11. package-lock.json defines the exact versions of the frontend dependencies used in this project.

  12. Project and configuration details used by Maven to build the project.

  13. An auto-generated file that defines the configuration for compiling TypeScript code in the project, when needed.

  14. An auto-generated file that defines the TypeScript type definitions used in the project.

  15. Can optionally be used to customize Vite configuration.

  16. An auto-generated file containing the Vite configuration needed for all applications.

Note
Project Content May Vary

The directory layout shown here may vary depending on the project’s configuration. For example, a project using pnpm instead of npm has a pnpm-lock.yaml file instead of package-lock.json.

The following files and folders should be added to source control:

  • <2> src/main/ - Application sources

  • <3> <4> <5> bundles/ - Pre-compiled frontend bundles

  • <6> frontend/ - Frontend resources (excluding generated/)

  • <7> index.html - Can be committed if generated, should be if customized

  • <8> META-INF/resources/ - Static web resources

  • <9> src/test/ - Test sources

  • <10> package.json - If exists

  • <11> package-lock.json - If exists

  • <12> pom.xml - Maven project configuration

  • <13> tsconfig.json - Can be committed if generated, should be if customized

  • <14> types.d.ts - Can be committed if generated, should be if customized

  • <15> vite.config.ts - Can be committed if generated, should be if customized

The following should not be added to source control:

  • <1> node_modules/ - Auto-generated from package files

  • <16> vite.generated.ts - Auto-generated by Vaadin

The following .gitignore file lists the files and folders that should be excluded from a typical Vaadin project.

Source code
.gitignore
/target/
.gradle
build/
!**/src/main/**/target/
!**/src/test/**/target/
!**/src/main/**/build/
!**/src/test/**/build/

.DS_Store

# The following files are generated/updated by vaadin-maven-plugin or vaadin-gradle-plugin
node_modules/
src/main/frontend/generated/
pnpmfile.js
.npmrc
vite.generated.ts

# Browser drivers for local integration tests
drivers/

# Error screenshots generated by TestBench for failed integration tests
error-screenshots/

# Eclipse and STS
.apt_generated
.classpath
.factorypath
.project
.settings
.springBeans
.sts4-cache

# IntelliJ IDEA
.idea
*.iws
*.iml
*.ipr
out/
!**/src/main/**/out/
!**/src/test/**/out/

# NetBeans
/nbproject/private/
/nbbuild/
/dist/
/nbdist/
/.nb-gradle/

# VS Code
.vscode/

# Maven wrapper
.mvn/
mvnw


# The following are auto-generated by Vaadin if missing, but they should be added to source control if customized.
tsconfig.json
types.d.ts
index.html

9E89021E-38BA-4ECE-9EA6-8B6AC2DB9C2B