incridible
5 months ago

new component is not displaying

Posted 5 months ago by incridible

hi, m new to vue and after installing it in Laravel, I make a new component but its not showing in browser, in developers tools > console it shows:

  app.js:37960 [Vue warn]: Failed to mount component: template or render function not defined.

   found in

  ---> <TaskForm>
   <Root>
  warn @ app.js:37960
  app.js:46384 You are running Vue in development mode.
  Make sure to turn on production mode when deploying for production.
  See more tips at https://vuejs.org/guide/deployment.html

any solution to resolve this issue?

component:

    <template>

<div class="col-md-8">
    <div class="card card-default">
        <div class="card-header">Task Form</div>

        <div class="card-body">
            <form action="./api/task" method="POST">
              <div class="form-group">
                <input type="text" name="title" placeholder="Task title" class="form-control">
              </div>
              <div class="form-group">
                <input type="submit" value="Add Task" class="btn btn-info">
              </div>
            </form>
        </div>
    </div>
</div>
    

export default { mounted() { console.log('Component mounted.') } }

app.js:

  require('./bootstrap');

  window.Vue = require('vue');

  Vue.component('example-component', require('./components/ExampleComponent.vue').default);

  Vue.component("task-form", require('./components/TaskForm.vue'));

  const app = new Vue({
   el: '#app'
  });

Please sign in or create an account to participate in this conversation.