How does stylesheet import work in vaadin flow?

Hi Guys,

I am starting a new project and i want to use vaadin flow for it. I am curious though as to how the stylesheet import works. I noticed the @StyleSheet annotation is used to import the stylesheets, but does it only get imported when the specific class, on which the annotation has been placed, is called? Is there a centralized place i can import all the stylesheets. I wouldn’t want to be constantly placing the @StyleSheet annotation.

Hi.

Basically if you have a MainLayout that all routes are linked to then
having the StyleSheet on the MainLayout should always load the stylesheet.

Documentation says that The style sheet is loaded when the component is shown for the first time in the browser.
see [Including Style Sheets]
(https://github.com/vaadin/flow-and-components-documentation/blob/master/documentation/importing-dependencies/tutorial-include-css.asciidoc)
Which means that when the parent layout MainLayout is loaded it will bring
with it the stylesheet.

If this doesn’t work then it would warrant a Bug ticket into github.

  • Mikael

Thanks Mikael,

Will work according to those rules then.