> Markdown version of [Source Control](https://vaadin.com/docs/v24/flow/configuration/source-control). Section index: [llms.txt](https://vaadin.com/docs/v24/flow/llms.txt)

# Source Control

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:

```
node_modules/                    (1)
src/
└── main                         (2)
    └── frontend                 (3)
        └── generated/
        └── themes/              (4)
            └── my-theme         (5)
                └── styles.css   (6)
        └── index.html           (7)
    └── java
    └── resources
└── test/                        (8)
target/
package.json                     (9)
package-lock.json                (10)
pom.xml                          (11)
vite.config.ts                   (12)
vite.generated.ts                (13)
tsconfig.json                    (14)
types.d.ts                       (15)
```

1. A folder that caches the frontend modules upon which the project depends.

2. Application sources. This folder is auto-generated based on the contents of `package.json` and `package-lock.json`.

3. Frontend resources — including CSS, TypeScript, and JavaScript files — are placed in this folder.

4. This folder includes custom themes.

5. Each theme is in its own sub-folder. The name of this folder is provided as a parameter to the `@Theme` annotation to apply the theme to the application.

6. `styles.css` is the theme’s master style sheet that’s loaded automatically when the theme is applied.

7. `index.html` is an auto-generated file that defines the outermost structure of the application.

8. Test sources.

9. `package.json` defines the version ranges of the frontend dependencies.

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

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

12. Can optionally be used to customize Vite configuration.

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

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

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

> **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 `.gitignore` file lists the files and folders that should be excluded from a typical Vaadin project.

`.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
webpack.generated.js
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`