Laravel Mix Vue Page showing Blank

Question

When I am running npm run dev or npm run production, I am getting an error that the Vue file does not have loaders defined.

I resolved this by using this resouce:
Compillation problem of extensions in vuejs

I used .vue in my webpack.mix.js.

Here is the example:

mix.js('resources/js/app.js', 'public/js').vue();

This enabled npm run dev to compile, but after compilation my Vue page got blank and this error is showing in console:

Laravel Version is 10
Node Version is 16
Laravel-mix version is 6.0.49

Answer 1

This issue has been resolved now we have to change vue import in app.js file From window.Vue = require("vue"); TO window.Vue = require("vue").default;