title: How do I support social media sharing and previews of my SPA NuxtJS app
body: <p>I've been making a SPA NuxtJS app. I inserted the appropriate code for setting the required meta tags, then I tried sharing a link on LinkedIn, but it wouldn't provide a preview, saying that an error has occurred.</p>
  
  <p>I tried checking the preview via LinkedIn's <a href="https://www.linkedin.com/post-inspector/inspect/" rel="nofollow noreferrer">tool</a>, but it returns the 404 error. If I put the same URL into the browser, the page opens just fine.</p>
  
  <p>Is it possible to enable social media previews for a statically served NuxtJS SPA, and is it possible to do it for dynamic routes as well? If yes, how?</p>
  
  <p>UPDATE: I've managed to get a simple preview going using the <a href="https://github.com/TiagoDanin/Nuxt-SEO" rel="nofollow noreferrer">Nuxt SEO package</a>. This, however, always displays the default image and title in the LinkedIn preview.</p>
  
  <p>nuxt.config.js</p>
  
  <pre><code>modules: [
      ...,
      'nuxt-seo',
      ...
  ],
  seo: {
      title: 'Default title',
      og: {
        image: &lt;default image&gt;
      }
  },
  </code></pre>
  
  <p>async data in component:</p>
  
  <pre><code>asyncData: (ctx) =&gt; {
      ctx.seo({
        title: 'Custom title in component',
        og: {
          image: &lt;link to alternate image&gt;,
        },
      })
  },
  </code></pre>
  
  <p>For dynamic pages, I've managed to avoid the 404 error by pointing requests to index.html so they can be found from there.</p>