devsoap/ds-gradle-vaadin

Webjar content not available in production mode

Closed this issue · 3 comments

steffen-harbich-cognitum commented

Desktop (please complete the following information):

  • OS: Windows
  • JDK version: 11
  • Gradle version: 5.0
  • Vaadin Plugin version: 1.0.1

Describe the bug
I have a spring boot vaadin application with gradle build using the plugin. I added a webjar dependency to my gradle build but it is not available when browser accesses my vaadin application, in production mode. A 404 is reported in FF console for path "http://localhost:8090/frontend-es6/bower_components/flag-icon-css/css/flag-icon.min.css". Relevant gradle build parts:

vaadin {
    productionMode true
}
dependencies {
    compile 'org.webjars.bowergithub.lipis:flag-icon-css:3.3.0'
}

Included via annotation on root layout class:

@StyleSheet("frontend://bower_components/flag-icon-css/css/flag-icon.min.css")

I am not sure, should this be working when production mode is enabled or am I completely wrong? Flags are shown when I start without production mode enabled.

The directory build/frontend/bower_components/flag-icon-css exists but build/webapp-gen doesn't contain anything about the flags after build, neither within resulting jar from bootJar task.

To Reproduce
See bug description.

Expected behavior
Contents of webjar dependency should be available to browser.

steffen-harbich-cognitum commented

With the latest version I have two observations now:

  1. (I think this was also visible before) Some text styles and some styles (margins) are not the same in production mode as in development mode, e.g. a Vaadin tab title is smaller in production mode. Any idea why? I can open a new issue if this is not related.

  2. In production mode, the flag CSS is now included in vaadin-flow-bundle-*.cache.html file but it is not picked up in HTML because it is just hanging around in a <div hidden="" by-polymer-bundler=""> I guess. Also, I tried to open one of the flag svg files manually but didn't succeed but maybe I used wrong path.

Appreciate any help.

brp-oskar commented

Your first problem could be that vaadin-lumo-styles/presets/compact.html is included in your production build. We got that problem when upgrading to Vaadin 13. We had to add this to our build.gradle file to exclude the file:

    importExcludes = [
        /.*[\\\\/]vaadin-lumo-styles[\\\\/]presets[\\\\/]compact.html.*/,
    ]
steffen-harbich-cognitum commented

@brp-oskar thanks, that works! So only issue 2 remaining.