New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Running nuxt generate on SPA mode should prerender meta tags #6240
Comments
You can include a head section within your nuxt.config to set some defaults, but setting pre-rendered / page specific meta tags is against the SPA principle. If you need that then you need to use nuxt generate which does exactly what you are requesting ;) |
@pimlie If I override any meta tag in a page file (pages/example.vue) and I generate the whole project with nuxt generate the meta tags will be the same as the default what I defined in nuxt.config.js. Reproduction steps:
When I start the app with nuxt dev and I open the blog page I see this in devtools:
but when I use nuxt generate I see this:
It's reproducible with any meta tags, so I think it's a bug. |
Hi @petergaal91, Thanks for taking the time to provide a reproduction although I wasn't able to reproduce a bug there, and by bug I mean something that is not intended to be the actual behavior of a single page application (SPA). Alright so here what's happening when you run your application in SPA mode, either with
This happens so fast that if you're checking while running To conclude if you want your meta tags to be available right in the HTML for social media and such you'll have to run your application in universal mode and either use Nuxt as a server with server side rendering (SSR) or as a static site generator (SSG) depending on your needs. Hope that was clear enough and that I'm not wrong on your issue, just wanted to dive a bit into it given how many thumbs up your message received~ Cheers! |
Thanks the detailed explanation! I forgot to drop a comment here, but I already switched to SSR (as you mentioned) a few months ago. |
Thanks for clearing that up. I was facing a similar issue and with some investigation only slowly found out that using spa mode was the reason why my meta tags didn't update properly. Maybe there should be an improved documentation on the mode property (https://nuxtjs.org/api/configuration-mode/). |
if nuxt is doing this, then SPA will never be good for use for social media sharing since they will always get the default nuxt.config.js instead of the page ones, this is really bad. I don't want to switch to server, but at this moment in time, it seems like there is really no way to make meta tag render on generate |
What problem does this feature solve?
Allows Nuxt SPA mode to provide og:title and og:image to social media page share.
Currently there seem to be no way to show page title and image to facebook share. This was tested using the following tool.
https://developers.facebook.com/tools/debug/sharing/
Problem is that when using pre-fetched data through nuxt.config generate dynamic routing API call and payload, Nuxt only generates static files in Universal mode. Once switched to SPA mode, all static files are always empty and default meta specified in nuxt.config will show.
For my case I do not have the option to use SSR due to the host constraint.
What does the proposed changes look like?
'npm run build' or 'npm run generate' with SPA mode will generate static files that includes pre-fetched data. Potentially would be nice to generate the whole page, but minimum need the og:title and og:image meta tags for social media sharing.
The text was updated successfully, but these errors were encountered: