Vue: [Vue warn]: Component is missing template or render function.
A component object has neither template nor render, or an SFC import resolved wrongly.
[Vue warn]: Component is missing template or render function.Component is missing template or render function[Vue warn]: Component is missing template or render function: Module {}Vue component missing template or render function Meaning
Typical causes: importing a .vue file without the Vue plugin/loader, importing the wrong thing (a module namespace or defineComponent result missing template), template string with the runtime-only build, or forgetting export default. Check import X from './X.vue' returns a component.
Common causes
- SFC not compiled (plugin/loader missing)
- Importing the namespace/wrong export
- Runtime-only build with
template:strings - Empty component definition
- Async component resolving to a module object
⚡ Quick fix
- Install/configure
@vitejs/plugin-vue/vue-loader import X from "./X.vue"(default)- Use a build with the compiler or render functions
Detailed fix by platform
Vue
- javascript
// vite.config.ts import vue from "@vitejs/plugin-vue"; export default { plugins: [vue()] };
How to diagnose
- Plugin — Configured?
- Import — Default component?
- Build — Compiler?
🔧 Still not fixed?
Many errors look alike. If the steps above didn’t solve it, one of these is probably what you’re facing:
Similar errors
- [Vue warn]: Slot "default" invoked outside of the render function Vue: [Vue warn]: Slot "default" invoked outside of the render function: this will not track dependencies used in the slot
- Component provided template option but runtime compilation is not supported Vue: [Vue warn]: Component provided template option but runtime compilation is not supported in this build of Vue. Configure your bundler to alias "vue" to "vue/dist/vue.esm-bundler.js"
- Could not find a production build in the '.next' directory Next.js: Error: Could not find a production build in the '.next' directory. Try building your app with 'next build' before starting the production server
Most viewed in Vue
- Property was accessed during render but is not defined Vue: [Vue warn]: Property "x" was accessed during render but is not defined on instance
- Avoid mutating a prop directly Vue: [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders
- Nuxt: window/document/localStorage is not defined (SSR) Nuxt: ReferenceError: window is not defined / 500 Internal Server Error during SSR
Other ways to find it
Where this error sits
Origin: On your device. Errors that are often confused with or caused by this one (click to open):
🧠 Still stuck? Analyze your error
Paste the full message, response headers or stack trace — we'll detect the platform and point to the most likely cause.
💬 What worked for others
No tips yet — did something else fix this for you?
Share what worked for you
Tips are checked by an editor before they appear. Links are removed.
Report a correction or suggest an improvement
Last updated 5 Nov 2026