本文详细介绍如何使用Composer安装Laravel最新版5.6，并在项目中集成Vue环境。通过手动配置Apache虚拟主机，实现项目的本地访问。文章还提供了如何在Laravel中安装并使用Vue的步骤，包括npm或cnpm的安装过程，以及如何查看和测试预设的Vue组件示例。
一、首先，composer下载laravel，可根据需要指定版本安装：composer安装laravel指定版本，我这里下的是最新版：laravel5.6。
我这里是自己配制的虚拟主机，没有配的直接访问你项目位置所在的路径即可。
另附Apache虚拟主机配置教程：Apache配置虚拟主机（新）
二、 vue的安装
laravle中默认支持vue环境，直接npm install即可（我这里用的cnpm install）
注：若没有的话（或想自定义版本），需要手动进行修改。
安装完成之后，会发现在resources\asset\js下会多出一个vue的小例子，打开ExampleComponent.vue和app.js你会发现他是一个完整的组件，在app.js中引入了vue，然后注册了一个名为ExampleComponent的组件，ExampleComponent.vue中定义了组件内容及样式。我们直接拿这个例子测试。
在resources\view下新建test.blade.php，填写以下内容：
<!doctype html>
<html lang="{{ app()->getLocale() }}">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="csrf-token" content="{{ csrf_token() }}"> <!--注意添加csrf_token验证-->
<title>Laravel</title>
<!-- Fonts -->
<link href="https://fonts.googleapis.com/css?family=Raleway:100,600" rel="stylesheet" type="text/css">
</head>
<body>
<div id="app">
<example-component></example-component>
</div>
<script src="{{ mix('js/app.js') }}"></script> <!--引入app.js-->
</body>
</html>
扫一扫
363
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
