Approachable, Versatile and Performant are the words used to describe Vue.js on their website.  Vue (pronounced /vjuː/, like view) is a progressive framework for building user interfaces. Unlike other monolithic frameworks, Vue is designed from the ground up to be incrementally adoptable. The core library is focused on the view layer only, and is easy to pick up and integrate with other libraries or existing projects. On the other hand, Vue is also perfectly capable of powering sophisticated Single-Page Applications when used in combination with modern tooling and supporting libraries. Vue is widely used with Laravel framework, By default, fresh Laravel applications contain an ExampleComponent.vue Vue component located in the resources/assets/js/components directory. The ExampleComponent.vue file is an example of a single file Vue component which defines its JavaScript and HTML template in the same file. Single file components provide a very convenient approach to building JavaScript driven applications. Vue packages version mismatch error occurs when the vue and vue-template-compiler version numbers are different.

As shown in the image above, my vue version is higher than that of the vue-template-compiler, this may cause things to work incorrectly. Make sure to use the same version for both. Specifying exact versions of vue and vue-template-compiler rather than leaving it up to npm to install or yarn to figure out dependencies helps keep both in sync hence keeping the occurrence of vue packages version mismatch not rampant

How I got it to work

Since the version of the vue-template-compiler is older than that of the vue I decided to update it to same version number as the vue thus 2.5.16 In your case the number might not be same as mine so replace the version number with what you see in your error message in the following command

npm install vue-template-compiler@2.5.16 --save-dev

The above command would fix the version mismatch error as shown in the accompanying image above.