安装laravel5.7框架
打开终端，输入以下命令
composer create-project laravel/laravel element-ui这里因为我在上一篇文章中已经新建了一个Nested Set项目，所以我就不再新建了，直接拿来用，有不明白的参考上一篇文章！
安装npm包
cnpm install //我一般用cnpm，这个是淘宝镜像，国内速度快安装好后，多出来了一个node_modules文件夹如下图：
到这里，其实就可以直接运行项目了，命令：
cnpm run dev完成后生成了一些编译后的css和js文件，结果如下：
app.js安装并引入element-ui
安装element-ui
cnpm i element-ui -S先来测试下Vue组件
打开reresources/js/components目录，我们会看到lavavel自带的一个.vue后缀的example文件：
Example Component
I'm an example component.
再继续打开reresources/js/app.js文件观察代码，发现已经引入了example-component组件：
require('./bootstrap');
window.Vue = require('vue');
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
const app = new Vue({
el: '#app'
});注意：上面的组件名叫example-component
我们直接新建一个页面来测试下组件吧：
- 新建「路由-控制器-视图」如下：
//修改web.php，增加一行：
Route::get('/hello','HelloController@index');- 创建控制器
HelloController.php文件:
php artisan make:controller HelloController- 控制器中定义一个index方法，返回视图：
- 创建视图
hello.blade.php文件，位于resources/views/目录下，随便写一段简单的代码：：
Laravel Vue Element-Ui
上面增加的两行代码就是引入组件用的：
这个时候，你访问 http://nestedset.test/hello 就会看到如下界面：
这说明，你的模板引入成功了。
引入element-ui
现在我们修改resources/js/app.js文件如下：
require('./bootstrap');
window.Vue = require('vue');
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
Vue.use(ElementUI);
Vue.component('example-component', require('./components/ExampleComponent.vue').default);
const app = new Vue({
el: '#app'
});上面的三行代码就是引入element-ui的，下面我们只要宿便复制一些element-ui组件的代码，放到ExampleComponent.vue文件中就行了，代码如下：
默认按钮
主要按钮
成功按钮
信息按钮
警告按钮
危险按钮
朴素按钮
主要按钮
成功按钮
信息按钮
警告按钮
危险按钮
圆角按钮
主要按钮
成功按钮
信息按钮
警告按钮
危险按钮
注意上面的template和div都不能少哦，代码放在这个里面就行了。
然后运行：
cnpm run dev再打开浏览器，你将看到以下界面：
elemnet-ui这里有个坑：我用Chrome浏览器怎么刷新都不变，这个时候你要用Shift+刷新才管用！
总结
虽然看起来不难，但是对于没有任何前端基础的人来说，这个坑还需要趟很久吧！
先这样吧，最基础的就是这个教程了，代码我继续传到Github上，自己看吧！
另外：细心的朋友肯定发现了下面的图片：
这个问题就大家自己解决吧！
我的博客：https://leijingwei.com
代码：https://github.com/leienshu/Nested-Set