网上的一些教程让我流泪。。。真的，我就是想安个 vue，能跑个实例，然后开开心心给到前端就完事了，都会夹杂一些 vue 的多余知识，这些可以后续看 vue 文档啊。

1. 看文档，你看 laravel 文档前端指南 vue 那块虽然短小无力，但是完全满足我上边说出的需求。

#项目根目录
npm install

2. 成功后目录多了一个 node_modules, 多余的一些文件可以不用管。

3. 执行多余文件 webpack.mix.js 中声明

npm run dev

4.laravel 给你自动生成的 vue 实例已经成功了。传不了图片，看代码吧 “项目目录 \resources\js\app.js”

/**
 * First we will load all of this project's JavaScript dependencies which
 * includes Vue and other libraries. It is a great starting point when
 * building robust, powerful web applications using Vue and Laravel.
 */
require('./bootstrap');
window.Vue = require('vue');
/**
 * The following block of code may be used to automatically register your
 * Vue components. It will recursively scan this directory for the Vue
 * components and automatically register them with their "basename".
 *
 * Eg. ./components/ExampleComponent.vue -> <example-component></example-component>
 */
// const files = require.context('./', true, /\.vue$/i);
// files.keys().map(key => Vue.component(key.split('/').pop().split('.')[0], files(key).default));
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
/**
 * Next, we will create a fresh Vue application instance and attach it to
 * the page. Then, you may begin adding components to this application
 * or customize the JavaScript scaffolding to fit your unique needs.
 */
const app = new Vue({
 el: '#app',
});

5. 编辑前端界面，根据你控制器来，你要是默认的 welcome.blade.php 你就把多余的都删掉，改成如下的即可。或者复制到你的前端页面。

<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
 <head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1">
 <title>首页</title>
 <!-- Fonts -->
 <link href="https://fonts.googleapis.com/css?family=Nunito:200,600" rel="stylesheet">
 <!-- app.css -->
 <link href="{{ asset('css/app.css') }}" rel="stylesheet">
 <!-- Styles -->
 <style>
 </style>
 </head>
 <body>
 <!-- app.js编译的Vue.component调用 -->
 <div id="app">
 <example-component></example-component>
 </div>
 <!-- app.js -->
 <script src="{{ asset('js/app.js') }}"></script>
 </body>
</html>

6. 在命令行内执行一遍

npm run dev

7. 浏览器访问，看到如两段文字就成功了

Example Component

I’m an example component.