pwa
pwa copied to clipboard
vuejs-templates
SSR
@addyosmani First off, thanks for such a great template. I managed to integrate this template with a clean ASP.NET Core 1.1 project with almost no hassle.
The only thing I haven't managed to hash out is how to handle SSR cleanly. Vue recommends using vue-server-renderer (https://ssr.vuejs.org/en/), but I've been running into issues due to the PWA requirements. In the ASP.NET Core world, SSR can be achieved with the SPAServices package (good example at http://mgyongyosi.com/2016/Vuejs-server-side-rendering-with-aspnet-core/), and adding a pre-render tag to one of the Razor Views and all the magic happens in the background. E.g.
<div id="my-app" asp-prerender-module="VuesStuff/renderOnServer" ... ></div>
but this can't be achieved with this vue template because it builds off of index.html where the pre-rendered tags are obviously not available.
Just trying to pick the communities brain on a path forward...?
(FYI this guide in particular made it super simple to integrate with your template https://blog.kloud.com.au/2017/02/14/running-vuejs-on-aspnet-core-apps/)
Thanks for opening this issue @azampagl and my apologies for the delayed response (travels). I think the Vue PWA template should be adjusted to work well with server-side rendering and I wonder if we can (either directly or via a recipe/docs) note how to switch from using the index.html to relying on vue-server-renderer to take care of this step for us.
@yyx990803 @sdras Do you have opinions on how much we should put in work to make this work well here vs. pointing folks at the Nuxt PWA template if they're trying to use SSR?
Thanks for pointing me at https://blog.kloud.com.au/2017/02/14/running-vuejs-on-aspnet-core-apps/! I hadn't seen this before.
IMO, since Nuxt has better lighthouse scores out of the gate, seems like it might make more sense to synch up with their efforts here so as not to duplicate efforts, and also because it's well-documented and easy to learn. It seems like this would have to wait until their full 1.0.0 release, though, as there are some major improvements coming.
Well, this is out of the box with vue-pwa:
Of course with some tinkering on the web server.
