laravel elixir如何实现实时预览
程序员文章站
2022-06-08 21:10:51
...
laravel5环境下,如何用elixir+browserSync实现php页面实时预览?
var gulp = require('gulp'),
browserSync = require('browser-sync').create(),
less = require('gulp-less');
var elixir = require('laravel-elixir');
//elixir.config.sourcemaps = false;
var config = {
name : 'baseblue',
version : '2.0.0',
proxy : 'localhost:8888',
jsDir : 'public/js/',
cssDir : 'public/css/',
minDir : 'public/min',
viewDir : 'resources/views/'
}
gulp.task('server', function() {
browserSync.init({
proxy: config.proxy,//代理地址
notify: false,
open: true
});
gulp.watch(['resources/assets/less/test.less'],['testless']);
gulp.watch([
config.viewDir+'**/*.blade.php',
config.jsDir+'**/*.js',
config.cssDir+'**/*.css'
]).on("change", browserSync.reload);
});
gulp.task('testless',function(){
return elixir(function(mix) {
mix.less('test.less');
});
});
为什么elixir不能在gulp task的函数中使用?
回复内容:
laravel5环境下,如何用elixir+browserSync实现php页面实时预览?
var gulp = require('gulp'),
browserSync = require('browser-sync').create(),
less = require('gulp-less');
var elixir = require('laravel-elixir');
//elixir.config.sourcemaps = false;
var config = {
name : 'baseblue',
version : '2.0.0',
proxy : 'localhost:8888',
jsDir : 'public/js/',
cssDir : 'public/css/',
minDir : 'public/min',
viewDir : 'resources/views/'
}
gulp.task('server', function() {
browserSync.init({
proxy: config.proxy,//代理地址
notify: false,
open: true
});
gulp.watch(['resources/assets/less/test.less'],['testless']);
gulp.watch([
config.viewDir+'**/*.blade.php',
config.jsDir+'**/*.js',
config.cssDir+'**/*.css'
]).on("change", browserSync.reload);
});
gulp.task('testless',function(){
return elixir(function(mix) {
mix.less('test.less');
});
});
为什么elixir不能在gulp task的函数中使用?
laravel自带browserSync
谢谢!终于实现了,根据elixir版本选择不同安装对应的laravel-elixir-browsersync插件。