vaadin flow 23.3 cannot early load JS files to client

Flow
1

I am using Vaadin 23.3 and want to early loading some JS files to client. So I put them to index.html.
I got error in browser (photo). Last time I can load these files without any issue.
There is change structure of frontend directory ?
@quick-witted-echidna
image.png
image.png

2

From which version did you update?

3

23.3.21

4

No, I mean in which version did it work before?

5

23.3.xx but not remember exactly

6

maybe 23.2

7

if i copy JS file to resource folder then it can load successful
image.png

8

not sure which dir is correct to put JS files

9

Static files should be within the resource folder - anything in the frontend folder is processed by vite (previously webpack) → your solution with the resource folder is therefore the correct location

10

meaning i no need put JS files into frontend ?

11

i want these JS files to be loaded to client before i can execute them from server via:
page.executeJs("callClient($0, $1, $2);",p1,p2,p3)

12

image.png

13

after try to remove all JS files from frontend folder and get error

14

because 3 files:
<script src="/javascript/clientGlobalConfig.js"></script> <script src="/javascript/clientCookie.js"></script> <script src="/javascript/clientLocation.js"></script>
in **index.html **cannot load early

15

No, that means “it depends”. Yours could be processed by vite if you need them to be processed, but the usage changes. If you want them referenced like this in the index.html the resource folder is the way to go.

16

but when i put


in index.html into resource folder, then i got error as above

17

so now i try to put them back to frontend folder

18

image.png

19

now like this one

20

https://vaadin.com/docs/latest/advanced/loading-resources has all information available, you can also check other files like images and see how the browser interprets those relative URLs, it’s most probably a path issue with base, static and relative path mix-up.