Styles.css not applied after migration from Vaadin 14 to Vaadin 24

125 Views Asked by At

I'm still working on the migration of our app from Vaadin 14 to Vaadin 24 and I've managed to have it more or less working. One of the last issues is that most of the CSS is not present.

I've followed these instructions to update my frontend directory from

frontend
└── styles
    ├── components
        └── [multiple CSS files]
    ├── lumo
        └── [multiple CSS files]
    ├── misc
        └── [multiple CSS files]
    ├── views
        └── [multiple CSS files]
    └── styles.css

to

frontend
└── themes
    └── my-app
        ├── components
            └── [only the files that where used in a CssImport with a "themeFor"]
        ├── lumo
            └── [no changes]
        ├── misc
            └── [no changes]
        ├── views<br>
            └── [no changes]
        ├── styles.css
        └── [moved here the files from the "components directory"]

I've removed every @CssImport from my app and added @Theme("my-app") to the class implementing AppShellConfigurator. I've also added an @import in the styles.css for every file not in the "components" directory.

The issue is that when I access my application there's barely any CSS. If I check in the style editor of my browser I get this:

missing css

Instead of this (I took this one from the app that's in production):

good css

As you can see there's a few styles missing. What am I doing wrong?

0

There are 0 best solutions below