在使用Gulp构建静态站点后部署到gh页面的问题

Question

我正在使用Gulp，BrowserSync建立一个静态网站，所有这些都运行良好，直到我将我的更改推送到我的gh-pages分支，希望它能通过gh-pages网站正确呈现我和＃39; m创造。我已经做了一些研究，我知道由于gh-pages的工作方式，我用于链接，图像等的路径必须包括根目录...以及我所做的一些更改代码将工作，但它最终搞砸了页面如何在gulp本地运行时工作。最重要的是，我在通过jquery加载部分html页面时遇到了问题，我认为这也与在gh-pages上托管时出错的路径有关。当我在gulp本地运行时，一切正常。如果我只是从终端打开index.html页面，它工作正常，但一旦我点击链接，事情就会变得混乱。有没有人知道一个完整的教程，视频，博客，或碰巧知道一个设置我的目录的好方法，以确保它既可以在本地工作，也可以在它被推到gh页面时工作？我已经附上了一张照片，显示了我目前的目录设置方式。

我的gulpfile看起来像这样

    var gulp = require('gulp');
    var sass = require('gulp-sass');
    var browserSync = require('browser-sync').create();

    gulp.task('styles', function () {
       return gulp.src('./scss/main.scss')
        .pipe(sass())
        .pipe(gulp.dest('./css'))
        .pipe(browserSync.reload({stream: true}));
    });

    gulp.task('serve', function () {
      browserSync.init({
        server: {
          baseDir: './'
        }
      });

      gulp.watch('./scss/*.scss', ['styles']);
      gulp.watch('./**/*.html').on('change', browserSync.reload);
   });

   gulp.task('default', ['styles', 'serve']);

以下是gh-pages目前的网站：https://andrewdpohl.github.io/STHR/

提前谢谢

Answer 1

在vinyl-fs github repo中记录.src()的使用： https://github.com/wearefractal/vinyl-fs

在base中保存时，.dest()属性用于确定文件名。

我认为您需要设置当前的工作目录：

gulp.src('./**/*.js', {cwd: '../src/main/'})
    .pipe(gulp.dest('../target/dist'));