Gulpを使用して静的サイトを構築した後で、gh-pagesに展開する際の問題

Question

Gulp、BrowserSyncを使用して静的なWebサイトを構築していて、変更をgh-pagesブランチまでプッシュするまで私が作成しているgh-pagesのウェブサイトから正しくレンダリングされます。私はいくつかの研究を行ってきましたが、gh-pagesが動作する方法のために、私がリンクや画像などに使うパスにはルートディレクトリを含める必要があります...そして私が行った変更のいくつかコードは機能しますが、最終的には、gulpを使用してローカルで実行している間にページがどのように動作するかを突き止めます。その上に、jquery経由で部分的なHTMLページを読み込む問題があります。これは、ghページでホストされているときにパスが間違っているとも考えています。私がgulpでローカルに実行すると、すべてうまく動作します。私が端末からindex.htmlページを開いただけでうまくいきますが、リンクをクリックすると物事が乱雑になります。誰もが徹底したチュートリアル、ビデオ、ブログを知っていますか、それがgh-pageにプッシュされたときだけでなくローカルでも動作するようにディレクトリを設定する良い方法を知っていますか？私は自分のディレクトリが現在どのように設定されているかを示す写真を含んでいます。

https://andrewdpohl.github.io/STHR/が.src()の使用が上の文書化されている

Answer 1

事前にありがとう：それは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']); 

のように見えますが、ウェブサイトでありますビニル-fsギブスレポ： https://github.com/wearefractal/vinyl-fs

baseプロパティは、.dest()に保存するときにファイル名を決定するために使用されます。

私はあなたが現在の作業ディレクトリを設定する必要があると思う：

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