Full-Stack Vue.js 2 and Laravel 5

Vue.js dependency
Let's now import Vue.js as a dependency of our entry file.
resources/assets/js/app.js: import Vue from 'vue'; import sample from './data'; var
app = new Vue({ ... });
Running the build again, we'll now see Vue.js in the list of modules in the
Terminal output, plus some dependencies that it has introduced:
Figure 5.10. Webpack Terminal output showing Vue.js You may be wondering how import Vue from
'vue' resolves, as it doesn't seem to be a proper file reference. Webpack will, by default, check the
node_modules folder in the project for any dependencies, saving you from having to put import Vue from
'node_modules/vue';.
But how, then, does it know the entry file of this package? Looking at the
Webpack Terminal output in the preceding screenshot, you can see that it has
included node_modules/vue/dist/vue.common.js. It knows to use this file because, when
Webpack is adding node modules as dependencies, it checks their package.json file
and looks for the main property, which in the case of Vue is.
node_modules/vue/package.json: { ... "main": "dist/vue.runtime.common.js", ... }
However, Laravel Mix overrides this to force a different Vue build.
node_modules/laravel-mix/setup/webpack.config.js: alias: { 'vue$':
'vue/dist/vue.common.js' }