介绍
gulp是一款基于nodejs流的自动化构建工具，之前也写过了一篇有关gulp如何实现页面实时预览的文章，有兴趣的技术控们可以去看看《gulp+browserSync实现静态,动态页面实时预览》，喜欢的小伙伴们还可以收藏收藏，小生在此谢过。 在某技术大神的指点之下，小生完成了Elixir的实时预览，在此之前查看了许多文档，为了避免大家陷入坑中于是写了这篇文章，那么问题来了，既然gulp本身也能实现关于php动态页面的实时预览，那么为什么我还非得去使用Elixir呢？
Elixir
Laravel的宗旨是让PHP开发变得轻松愉悦，所以从Laravel 5开始，提供了一个新的被称作Laravel Elixir的API(也就是基于Gulp封装成的一套更适合laravel的API)。 该API提供了简洁流畅的解决方案，让你能够为你的Laravel 应用程序定义基本的 Gulp 任务，支持许多常见的 CSS 与 JavaScrtip 预处理器，甚至包含了测试工具，从而减少编写上述繁琐任务的时间，有效提高编程效率。 当然了，如果你不想用Elixir的话也无可厚非(请恕fidding本人语体教)，毕竟技术无限各有喜好;你完完全全可以由gulp一手搞定，但取而代之的就是你可能要为此多写许多代码并且无法领略Elixir的魅力之处了。 所以在此建议使用laravel5的技术控们，如果你打开了gulp大门，那请拥抱Elixir吧！
安装与使用
安装gulp与browsersync
由于Gulp是基于 Node.js 的，请确保已安装NodeJS，至于NodeJS的安装我就不多赘言了。
进入laravel5的项目根目录，修改package.json为如下
{
"private": true,
"author": "fidding.hjh",//作者
"devDependencies": {//开发的时候需要的依赖项 --save-dev
},
"dependencies": {//正常运行的依赖包 --save
"gulp": "^3.9.0",//gulp
"laravel-elixir": "^2.0.0",//默认存在
"bootstrap-sass": "^3.0.0",//默认存在
"laravel-elixir-browsersync": "^0.1.5"//brosersync
}
}
其中bootstrap-sass与laravel-elixir是默认已经存在的，在此，请特别注意laravel-elixir的版本号，因为对于不同的elixir版本，需要下载对应的laravel-elixir-browsersync，在其文档中有这么一句话，
If you use Laravel Elixir Version "^3.0.0". Follow this link
If you use Laravel Elixir Version Below "^3.0.0".
就是elixir版本号大于等于3.0.0的点击该连接，小于3.0.0.0的就是该版本 小生这英语水平都能看得懂，对于你们我也就放心得很。
接着在cmd(项目根路径)下运行（管理员权限打开）
gulp install让nodejs转一会，最后你会发现根目录下多了一个node_module文件夹，里面文件如下
到这里安装便算是完成了。 使用
打开laravel5项目根目录的gulp.js文件，添加代码如下
var gulp = require('gulp'),
elixir = require('laravel-elixir');
browserSync = require('laravel-elixir-browsersync');
elixir(function(mix) {
browserSync.init();
mix.BrowserSync({
proxy : 'localhost:8888',//apache或IIS等的代理端口
logPrefix : 'Laravel Eixir BrowserSync',
reloadOnRestart : false,
notify : false
});
});
保存后在cmd下运行，请确保你的apaceh服务器或..is open的。
gulp watch结果显示如下
结语
ok，任务完成，最后套用Laravel中文文档Elixir篇章里的一句话
如果你曾经对于使用 Gulp 及编译资源感到困惑，那么你绝对会爱上 Laravel Elixir！
happy joining！
相关文档
laravel-elixir-browsersync API
洪加煌