I am new in Vue.js. I want to understand on using component. I tried to import my component to another component but it failed. I am using Laravel 5.8. Below are the error that I received.

Module not found: Error: Can't resolve
'./components/modalAlert.vue

Below are my codes.

app.js

Vue.component('form-to-do', require('./components/formToDo.vue').default);

Vue.component('modal-alert', require('./components/modalAlert.vue').default);



const app = new Vue({

    el: '#app',

});

formToDo.Vue

<template>

// form 



<modal-alert></modal-alert>

</template>



<script>

import modalAlert from './components/modalAlert.vue';



export default {

    components: {

       'modal-alert': modalAlert 

    },



    data() {

        return {

            setErrors: [],

            tasks: [],

            task: {

                id: '',

                name: '',

                completed: '',

                date_completed: ''

            },

            result: '',

            input: {

                name: ''

            }

        };

    },

}

</script>

modalAlert.vue

<template>

    <div class=modal fade id=exampleModal tabindex=-1 role=dialog aria-labelledby=exampleModalLabel aria-hidden=true>

      <div class=modal-dialog role=document>

        <div class=modal-content>

          <div class=modal-header>

            <h5 class=modal-title id=exampleModalLabel>Modal title</h5>

            <button type=button class=close data-dismiss=modal aria-label=Close>

              <span aria-hidden=true>&times;</span>

            </button>

          </div>

          <div class=modal-body>

            Test  

          </div>

          <div class=modal-footer>

            <button type=button class=btn btn-secondary data-dismiss=modal>Close</button>

            <button type=button class=btn btn-primary>Save changes</button>

          </div>

        </div>

      </div>

    </div>

</template>



<script>

    export default {

        props: ['id'],

        data() {

            return {



            }

        },



        mounted() {

            console.log('Component mounted.')

        }

    }

</script>