Get many Errors on client side with Spring Boot

Hello,

I have build an application with the new Vaadin 10 (beta2) platform and Spring Boot 2.0.0-RELEASE. I get multiple errors on client side when open a view. I have build the templates with the Vaadin Designer. The error messages looks like this one:

Error loading http://localhost:8090/frontend/component/bower_components/vaadin-ordered-layout/src/vaadin-horizontal-layout.html

The console logs looking like this one:

GET http://localhost:8090/frontend/component/bower_components/vaadin-text-field/src/vaadin-text-field.html 404 ()

This error occurs when navigating to a view. When I open a view over the URL all looks fine.

Greetings!

Hi Henrik,

do I understand your right, that the view isn’t rendered because of the client side errors?

I am wondering about the path the application uses to resolve the vaadin-text-field.html. I would expect http://localhost:8090/frontend/bower_components (without component). Some details of your project structure will help and maybe a list of the HTML imports the affected view uses (I guess those are auto-generated by the Designer).

Cheers,
Paul

Hello,

thanks for ypur reply!

My UI is rendering all normal as expected, but the errors are also shown.
I want to represent my Java package structure in the webapp folder for better organisation.

I have only one HTML import in my Java component class:

@HtmlImport("context://frontend/view/scanner/scanner-view-template.html")

Is this a problem for Vaadin Flow?

Ok, good to hear it works at least.

You are free to structure your webapp folder as you like. As long as you define the path correctly. But if I understand you right the problem is not scanner-view-template.html but one of the components used in it, right? What’s the content (or at least the list of <link rel="import" href="">) of that file. I have the feeling that the Designer created an invalid import as the bower_components is normally in the root of your frontend folder.

[b]
Hello,

thanks for your reply!

Here the list of imports they are used in my template:
[/b]

<link rel="import" href="bower_components/polymer/polymer.html">
<link rel="import" href="bower_components/vaadin-ordered-layout/src/vaadin-vertical-layout.html">
<link rel="import" href="bower_components/vaadin-ordered-layout/src/vaadin-horizontal-layout.html">
<link rel="import" href="bower_components/vaadin-grid/src/vaadin-grid.html">
<link rel="import" href="../../component/scan-field-component.html">
<link rel="import" href="../../bower_components/vaadin-ordered-layout/src/vaadin-horizontal-layout.html">
<link rel="import" href="../../bower_components/vaadin-button/src/vaadin-button.html">
<link rel="import" href="../../bower_components/vaadin-ordered-layout/src/vaadin-vertical-layout.html">

Okay, thanks!

I’m using the latest beta of Vaadin Designer (3.0.0.beta2) with the latest release version of Intellij Ultimate. It occurs on all templates I created with the designer.

I have created the whole view with the designer and no, I don’t do anything manually in the HTML file.

Greetings!

Yes, as I expected. The imports are broken.

As your scanner-view-template.html seems to be in frontend/view/scanner/ and your bower_components in frontend/ all of your imports should start with <link rel="import" href="../../bower_components/... as you already do for some.

You may want to check your scan-field-component.html component for invalid imports, too.

I would like to understand how that happended. Did you create the whole view with the Designer or did you add some of the stuff manually? Also, wich Designer version you are using, which IDE? And can you reproduce this?

Awesome. To be honest, I did not work with the latest Designer, yet, but just installed it for one of our internal projects and I will try to reproduce your issue. I checked the issue tracker (GitHub - vaadin/designer: Public repository for Vaadin Designer) but did not find anything related. Let’s see.

I will ping you later again. Thanks for being a BETA tester :wink:

Cheers

Okay, thank you and no problem! :slight_smile:

I was able to reproduce a similar issue with the Designer and had a nice discussion with the team.

Let’s wait for a new release and then I might ping you back, again.