Does Nuxt fully support the latest Vue Functional Components?

[pxwee5]

As per topic. Because I tried

<template functional>
  <div>Test Functional</div>
</template>

When I do a page refresh, I got this error _vm._ssrNode is not a function

Not sure what I'm doing wrong. If someone could point me in the right direction it will be great.

_{This bug report is available on Nuxt.js community (#c2230)}

[mouafa]

@pxwee5 try to add the current snippet to your nuxt.config.js and make sure you're not lazy loading them otherwise you'll encounter this #2841

build: {
    extend(config) {
      //fix for _vm._ssrNode is not a function for functional component
      config.module.rules.forEach(rule => {
        if (rule.test.toString() === '/\\.vue$/') {
          rule.options.optimizeSSR = false
        }
      })
    }
  }

[timwis]

@mouafa doesn't that have a side-effect of...not optimizing SSR for vue component files, including non-functional ones?

[mouafa]

@timwis I'm not sure, the documentation description says

Enable Vue 2.4 SSR compilation optimization that compiles part of the vdom trees returned by render functions into plain strings, which improves SSR performance. In some cases you might want to explicitly turn it off because the resulting render functions can only be used for SSR and cannot be used for client-side rendering or testing.

But since we're generating a static site this might only affect the build time.

[manniL]

Should work in the latest nuxt-edge (and IIRC in the latest nuxt) version

[ghost]

This bug-report has been fixed by @manniL.

Should work in latest nuxt-edge release (possibly in latest nuxt release, v1.4.2 too)

[lock]

This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.