在Gulp.js服务器上设置liverload



我试图设置我的构建系统,但有一些麻烦,让liverload与我需要的文件一起工作。我在下面包含了我当前的gulpfile。当我运行gulp命令时,我知道服务器运行在"localhost:35729/"上。然而,当我在浏览器中访问该地址时,我收到了以下消息:

{"tinylr":"Welcome","version":"0.1.6"}

基本上我需要知道的是我如何能得到我的索引页显示在这里,而不是这个消息,作为Chrome liverload扩展不会重新加载我的索引页的版本,只是坐在我的离线目录。

var gulp = require('gulp');
var uglify = require('gulp-uglify');
var sass = require('gulp-ruby-sass');
var livereload = require('gulp-livereload');
function errorLog(error) {
    console.error.bind(error);
    this.emit('end');
}
// Scripts Task
// Uglifies
gulp.task('scripts', function(){
    gulp.src('js/*.js')
    .pipe(uglify())
    .on('error', errorLog)
    .pipe(gulp.dest('minjs'))
});
//SASS Task
//Compiles SASS
gulp.task('sass', function(){
    return sass('scss/*.scss', { style: 'compressed' })
    .on('error', errorLog)
    .pipe(gulp.dest('./css'))
    .pipe(livereload());
});
// Watch Task
// Watches JS and CSS
gulp.task('watch', function(){
     livereload.listen();
     gulp.watch('js/*.js', ['scripts']);
     gulp.watch('scss/*.scss', ['sass']);
});
gulp.task('default', ['scripts', 'sass', 'watch',]);

最后我做了。基本上,LiveReload Chrome应用程序不会监视离线文件的更改(即直接从其目录打开的文件)。对此,我的解决方案是配置一个MAMP web服务器,将我的站点目录作为主目录。然后我可以在web服务器上打开索引页,然后点击LiveReload Chrome按钮,它开始观察变化。

我不认为设置一个MAMP服务器是必要的解决方案,这只是我处理它的方式,因为我现在也可以为移动设备测试网站。

相关内容

  • 没有找到相关文章

最新更新