Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

331
Views
Vuejs 3 and laravel : Component is missing template or render function

This error occurs everytime i try to use vuejs3 with laravel

Vue warn]: Component is missing template or render function. 
  at <App>

I started a new laravel project 8 with vuejs 3 and same problem again , i don't know how to handle it. Here's some of my configurations file.

app.ts


require('./bootstrap');


import { createApp } from "vue";
import Welcome from "./components/Welcome.vue";

const app = createApp({
    components: {
        Welcome,
    },
}).mount("#app");

webpack.mix.js

const mix = require('laravel-mix');



 mix.ts("resources/js/app.ts", "public/js").vue({ version: 3 })
    .postCss('resources/css/app.css', 'public/css', [
        //
    ]);

Welcome.vue

<template>
    <div id="app">
  Hello {{ name }} welcome to my app.
  <hr />
    </div>
</template>
<script lang="ts">
import { defineComponent, ref } from "vue";

export default defineComponent({
  
  setup() {
    const name = ref<string>("Bijaya");
    return {
      name,
    };
  },
});
</script>

package.json for versions

    "devDependencies": {
        "@vue/compiler-sfc": "^3.2.13",
        "axios": "^0.21",
        "laravel-mix": "^6.0.6",
        "lodash": "^4.17.19",
        "postcss": "^8.1.14",
        "ts-loader": "^9.2.6",
        "typescript": "^4.4.3"
    },
    "dependencies": {
        "vue": "^3.2.13",
        "vue-loader": "^16.6.0"
    }

If you have any clue please tell me , thanks

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

I don't really understand why but changing in app.ts this

import { createApp } from "vue";
import Welcome from "./components/Welcome.vue";

const app = createApp({
    components: {
        Welcome,
    },
}).mount("#app");

to this:

import { createApp } from "vue";
import qrcode from './components/qrcode.vue'
createApp(qrcode).mount("#app")

did the work

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!