What is the best way to separate applications by files?

Question

JavaScript

1. There is a multi-page application, sometimes with full server-side rendering (important for SEO). VueJS
2 is used. Different components are used on different pages
What is the best way to organize code separation across JS files?
1. Load a separate JS file for each page only with the components that are used there
2. Collect everything into one conditional app.js, connect it everywhere and check in it, if the element is on the page, then mount the component in it, and no - so no.

Answer 1

Option 2 is better in my opinion.

Answer 2

I use the first option. I do it on ruby ​​on rails, it is implemented there "in the box"
I get application.js - here I write the scripts necessary for all pages. Next, the required page.js is connected, in it I connect the modules necessary for this page and write the code used on this page.
Same for css.
During deployment, the rails automatically collect their minimized files for each page, and it turns out that in production for each page there is one small file that contains only the necessary code for this page.
Something like this.