😆
Angularで作成したWEBアプリをgithub pagesで公開する
初めに
Angularで作ったアプリを他の人に見てもらいたい場合、わざわざサーバーレンタルして…ってやらなきゃいけないのか…？って思って調べてみたらgithub pagesから全世界に公開できるようです！
環境
angular-cli-ghpagesというパッケージを使います。
こいつが必要とする環境が以下の通りなので最低環境はこれになります。
- Git 1.9以降
- Angular CLI v9.0.0以降を介して作成されたAngularプロジェクト
(ng updateでプロジェクトをupdateすればv9.0.0未満でも行けるらしいです。)
手順
-
angular-cli-ghpagesをプロジェクトに追加します。
ng add angular-cli-ghpages
- Angularアプリケーションをdeployします。
このコマンドを実行するとAngularアプリケーションは自動的にProdビルドされます。
ng deploy --base-href=/RepositoryName/
成功するとコマンドラインに下記のように表示されます。
🌟 Successfully published via angular-cli-ghpages! Have a nice day!
-
githubのリポジトリを見るとgh-pagesというブランチが自動的に切られていると思います。
-
あとはリポジトリの『settings』→『pages』で公開するブランチをgh-pagesに変更すればOKです。
画面上部にURLが表示されているのでそこからアクセスすればAngularのWEBアプリが動いているはず！(URL例：https://username.github.io/repositoryname)
まとめ
サーバーサイドが必要ないWEBアプリなら簡単に全世界に公開できる！
参考
Discussion