如何使用gulp + browsersync来运行apache vhost?

时间:2015-03-22 06:16:51

标签: apache gulp browser-sync

我想在我的工具包中添加gulp,sass和browsersync。 我现在正在运行gulp并配置了sass和browsersync任务。

我正在为我的本地apache服务器上的vhost运行一个php应用程序。

我正在尝试从监视任务运行browsersync,使用browsersync的代理选项来使用我的虚拟主机。

目前,当我运行手表时,在端口3000上找不到服务器。如果我导航到'localhost:3000',我会发现'没有找到网页'的消息。

如果我导航到端口3001,我可以访问browsersync的管理界面。所以我知道browsersync正在运行。

我的gulp conf如下

/* load plugins */
var gulp = require('gulp'),
    sass = require('gulp-ruby-sass'),
    browsersync  = require('browser-sync') ;

/*
*  define tasks
*/

gulp.task('sass', function() {
    return sass('assets/sass/main.sass') ;        
}) ;


/*
*  browsersync conf
*/

gulp.task('browser-sync', function() {
    browsersync({
    proxy: 'localhost',
    port: '3000'
    });
});

gulp.task('browsersync-reload', function () {
    browsersync.reload();
});

gulp.task('watch', ['browser-sync'], function () {
  gulp.watch('assets/sass/**/*', ['css']);
});


/* Default task */
gulp.task('default', ['sass'], function() {
    gulp.watch("assets/sass/**.*", ['sass']);
});

3 个答案:

答案 0 :(得分:9)

如果您已安装apache(带mamp的示例),则必须将端口配置为8080

我的配置:

 browserSync.init({
      open: 'external',
      host: 'local.dev',
      proxy: 'local.dev',
      port: 8080 // for work mamp
});

答案 1 :(得分:3)

BrowserSync“代理”选项应该指向您的apache主机为您的应用提供服务的位置,而不是您要访问它的位置。

例如,如果我在localhost:9000上运行ruby服务器,我会在代理选项中指出并通过浏览器通过浏览器同步将通过命令行输出给我的URL访问

答案 2 :(得分:-1)

使用此代替,添加vhost,例如mysite.local

然后

gulp.task('server', function() {
     browserSync.init({
        proxy: "mysite.local"
    });
});