Nuxt static site - where is the markup?

Question

I've set the mode to static and ran npm run generate. The site is being served from the /dist/ directory, but where is the markup when I view the source? view-source:https://eosnomad.com/

I don't think I'm getting the SEO benefits here since Google doesn't see HTML. I only see the source code when looking in dev tools. Am I doing this wrong?

Here is my nuxt configuration:

export default {
  target: 'static',
  head: {
    title: process.env.DOMAIN,
    meta: [
      { charset: 'utf-8' },
      { name: 'viewport', content: 'width=device-width, initial-scale=1' },
      {
        hid: 'description',
        name: 'description',
        content:
          process.evn.CONTENT,
      },
    ],
    link: [{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }],
  },

  css: [],

  plugins: [
    { src: '~/plugins/cookie-law', mode: 'client' },
    { src: '~/plugins/vue-agile', mode: 'client' },
    { src: '~/plugins/vue-js-modal', mode: 'client' },
    { src: '~/plugins/vue-formulate', mode: 'client' },
    { src: '~/plugins/vue-the-mask', mode: 'client' },
    { src: '~/plugins/route-to-hash', mode: 'client' },
    { src: '~/plugins/global-components', mode: 'client' },
  ],

  components: true,

  publicRuntimeConfig: {
    baseSiteTitle: '${DOMAIN}',
    siteID: '${WORDPRESS_SITE_ID}',
    cmsEndpoint: process.env.IS_LOCAL
      ? 'https://dashboard${TLD_LOCAL}/${WORDPRESS_SITE_SLUG}/${WORDPRESS_ACF_ENDPOINT}'
      : 'https://dashboard${TLD}/${WORDPRESS_SITE_SLUG}/${WORDPRESS_ACF_ENDPOINT}',
    newsEndpoint: process.env.IS_LOCAL
      ? 'https://dashboard${TLD_LOCAL}/wp-json/getnews?property_id=${WORDPRESS_SITE_ID}'
      : 'https://dashboard${TLD}/wp-json/getnews?property_id=${WORDPRESS_SITE_ID}',
  },

  tailwindcss: {
    exposeConfig: true,
  },

  loading: false,

  buildModules: [
    '@nuxtjs/tailwindcss',
    '@nuxtjs/pwa',
    [
      '@teamnovu/nuxt-breaky',
      {
        enabled: true,
        enableInProd: false,
        colorScheme: 'auto',
        position: 'bottomRight',
      },
    ],
  ],

  modules: [
    '@nuxtjs/axios',
    '@nuxtjs/svg',
    'nuxt-fontawesome',
    '@nuxtjs/dayjs',
    ['vue-scrollto/nuxt', { duration: 1000, easing: 'ease-in-out' }],
  ],

  dayjs: {
    plugins: ['isSameOrAfter', 'isSameOrBefore'],
  },

  fontawesome: {
    imports: [
      {
        set: '@fortawesome/free-solid-svg-icons',
        icons: [
          'faBullhorn',
          'faSortUp',
          'faSortDown',
          'faUtensils',
          'faEnvelopeOpenText',
          'faArrowLeft',
          'faArrowRight',
          'faTimesCircle',
        ],
      },
      {
        set: '@fortawesome/free-brands-svg-icons',
        icons: ['faFacebookSquare', 'faTwitterSquare', 'faInstagram'],
      },
    ],
  },

  webfontloader: {
    typekit: {
      id: 'XXXX',
    },
  },

  render: {
    bundleRenderer: {
      shouldPreload: (file, type) => {
        return ['script', 'style', 'font'].includes(type)
      },
    },
  },

  // Axios module configuration (https://go.nuxtjs.dev/config-axios)
  axios: {},

  // Build Configuration (https://go.nuxtjs.dev/config-build)
  build: {},
}

Answer 1

I got it. This is a single page website and I put all the components in the default layout file. In order to generate static markup properly it all needs to be in the index.vue file.