gh-pages動的ルーティングリフレッシュ後の404ソリューションへの単一ページ適用


gh-pageは静的リソースしか保存できないからです..htaccessはサポートされていないため、vue+vue-router+webpackで構築された単一ページアプリケーションが直接gh-pageブランチにdistファイルをプッシュし、ルーティングを切り替えた後に手動でリフレッシュすると404が現れる.2ステップで解決できる
1.サイトルートディレクトリに404.htmlを追加します.一般的にはdistディレクトリの下です(gh-pageで見つからないパスはこの404.htmlに自動的にアクセスします)



    
    

  sessionStorage.redirect = location.href;




     


2.index.html追加

  //          js   
  (function(){
    var redirect = sessionStorage.redirect;
    delete sessionStorage.redirect;
    if (redirect && redirect != location.href) {
      history.replaceState(null, null, redirect);
    }
  })();


完了、詳細ルールはspa-ghpage-hackを参照