It's always best to create separate projects for back end and front end. So you're reducing the dependency and will be easy for both kind of developers.

There are many advantages by splitting it. One example would be to easily deploy Vuejs app to a static hosting site like Netlify.

PS: We switched from VueJS to ReactJS. Make sure you have done enough research before switching

Our "legacy" AngularJS/ .NET MVC project exists as two independent projects. The back end exists as a .NET solution (or collection of solutions. I'm not sure as I work on the front-end). The front-end exists on a separate repository as static files, essentially (after the project is built). The client communicates with the back-end via RESTful APIs. Like Gijo Varghese mentioned, this decoupling allows you to easily host your built front-end code anywhere (Netlify works great for this).

Currently we are developing new projects that still leverage the same APIs but has a different front-end that uses ReactJS. That's another benefit: you can just plug in different front-ends as needed

Like anything else, Authentication/Authorization is done via REST endpoints. Login endpoint issues a token that the client manages (pick your favorite storage for this. Out AngularJS project used cookies out ReactJS project uses Redux). The token is passed as header for any subsequent request that requires authorization.