[Vuejs]-Vue-server-renderer occured render function or template not defined in component: anonymous

by

0👍

You should change your import statements. The import child components should be like:

import ChildComponent from '. .../ChildComponent.vue'

export default {
  components: {
    ChildComponent
  }
}

And function imports should be like:

import {myFunction} from "..../myFile"

0👍

I found my own solution.
There were multiple causes.
First, regarding the component error.
It was caused by using dynamic import of a component with a variable.

<template>
  <div>
    <component :is="getComponentIs()" />
  </div>
</template>

<script>
export default {
...
computed: {
  getComponentIs() {
    return Vue.component(compName, () => import( 
           '../components/' + this.componentName + '.vue') 
         ))
  }
}
...
}
</script>

The component problem was fixed when I modified it to explicitly write all components as follows.

export default {
  components: {
    ComponentA: () => import('../components/ComponentA.vue')
   ...
  }
}

Next, the error when importing an external file was caused by importing an external library in an external file.
external.js.

import numeral from 'numeral'
export const something = [...].

Eliminating the import statement solved the problem.

Leave a comment