UI problems in Production build

I have a Vaadin 24 Spring Boot project that works fine when in development mode. When I build with the production profile I get a jar that I run on a Ubuntu server. Most things work fine but there are some errors regarding UI:

2023-12-09T20:25:23.036Z **ERROR **4605 — [nio-8080-exec-8] c.v.flow.component.internal.UIInternals : The component class com.vaadin.flow.component.timepicker.TimePicker includes ‘@vaadin/time-picker/src/vaadin-time-picker.js’ but this file was not included when creating the production bundle. The component will not work properly. Check that you have a reference to the component and that you are not using it only through reflection. If needed add a @Uses(TimePicker.class) where it is used.

2023-12-09T20:25:23.037Z **ERROR **4605 — [nio-8080-exec-8] c.v.flow.component.internal.UIInternals : The component class it.studyapp.application.ui.dialog.calendar.DateTimePickerDialog includes ‘@vaadin/custom-field/src/vaadin-custom-field.js’ but this file was not included when creating the production bundle. The component will not work properly. Check that you have a reference to the component and that you are not using it only through reflection. If needed add a @Uses(DateTimePickerDialog.class) where it is used.

These are two examples. I tried forcing production build and doing a ci build in the production profile. I make sure I run the build-frontend goal. I tried the Uses annotation on top of the classes that use the classes that give me the error (e.g @Uses(TimePicker.class)). I tried using JsModule annotation on top of the same classes to import those js files. Nothing seems to work. Any suggestion would be greatly appreciated

What is your setup? Multi module project? Reflection based instantiation? Something other non-standard stuff?

The project should be pretty standard. I started from the flow-crm-tutorial and then built my app. I have some Views, a MainLayout, some UI components and a couple of add-ons. It seems that the errors arise when I try to use a class that extends Dialog, although, as you see in the post, I got errors for TimePicker and my DateTimePickerDialog (which actually extends CustomField). I also encountered similar errors when I use TextArea. I have no problem in development but it seems that some js scripts are not bundled in production and I haven’t figured out why

Workaround cause it’s late here, configure “optimizeBundle = false” described here https://vaadin.com/docs/latest/production/production-build

To find the real culprit, I probably need a little more like some example code of usage of that dialog, route and e.g. package names (are those all below your main entry?)

Would you prefer if I gave you the github repo and some indications on where to find these classes? You can look at it when you have time but I am pretty desperate as I have to hand in the project for a uni exam. If that is any trouble I can try to explain everything necessary

Actually @quirky-zebra thank you so much, it worked! Everything I tried was pretty much useless, “optimizeBundle=false” was the key

If it’s hosted on GitHub, I can take a look at it, that would make it easier :+1:

Setting optimizeBundle to false did the trick, thanks again! I was not letting npm install all the dependencies even though I thought I was

OptimizeBundle is just a workaround :wink: in the long run… it should normally not be needed

where did you specify this property?

Maven plugin configuration