ホームページ > バックエンド開発 > PHPチュートリアル > laravel elixir如何实现实时预览

laravel elixir如何实现实时预览

WBOY
リリース: 2016-06-06 20:23:34
オリジナル
1492 人が閲覧しました

laravel5环境下,如何用elixir+browserSync实现php页面实时预览?

<code>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');
    });
});</code>
ログイン後にコピー
ログイン後にコピー

为什么elixir不能在gulp task的函数中使用?

回复内容:

laravel5环境下,如何用elixir+browserSync实现php页面实时预览?

<code>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');
    });
});</code>
ログイン後にコピー
ログイン後にコピー

为什么elixir不能在gulp task的函数中使用?

laravel自带browserSync

谢谢!终于实现了,根据elixir版本选择不同安装对应的laravel-elixir-browsersync插件。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート