Combining Laravel + Vue.js got Error ( Module not found: Error: Can't resolve './vue/App' in 'C:\xampp\htdocs\todolist\resources\js' )

Question

So I did everything like this video https://www.youtube.com/watch?v=UHSipe7pSac but after that I got this error :

:( "ERROR in ./resources/js/app.js 4:0-28 Module not found: Error: Can't resolve './vue/app'

this is my /resources/js/app.js file

require('./bootstrap');

import Vue from 'vue';

import App from './vue/App';

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

and this is my webpack.mix.js file

mix.js('resources/js/app.js', 'public/js').vue()
    .postCss('resources/css/app.css', 'public/css', [
        //
    ]);

Answer 1

You're using the Vue const itself as a component. (Aside from the other correct comments on your question)

import App from './vue/App'; <----- Uppercase App

const app = new Vue( <----- Lowercase app
    {
        el: '#app',
        components: { app } <------- Lowercase app
    }
);

Try changing those up. But even better, improve your naming. Like Home.vue

Happy coding!