Ionic3を使って作成したアプリを、GitHub Pagesで公開する方法について
バージョン情報
- ionic-angular@3.9.2
- Angular@5.2.10
GitHub Pagesで公開する
GitHubの設定を変更する
GitHubにアクセスして、GitHub Pagesで公開したいアプリのリポジトリの設定ボタンをクリックする
GitHub PagesのSourceを、None
からmaster branch
に変更する
Ionicアプリをビルドする
ターミナルを開いて、下記のビルドコマンドを実行する
$ ionic build --prod
出来上がったwww/
フォルダを丸ごとGitHubにプッシュする
なお、.gitignore
にwww/
が含まれたままだとプッシュできないので、事前に削除しておくのを忘れないように注意
これで、GitHub Pagesへの公開が完了する🍺🍺🍺
実際に参照してみる
GitHub PagesにプッシュしたIonicアプリを参照するには、https://[GitHubアカウント名].github.io/[リポジトリ名]/www
のURLにアクセスすれば良い。
※ビルドした資源は、www/ 配下にあるため、URLに /www をつけるのを忘れないように
今回は、GitHubアカウント: l08084
リポジトリ名: ionic-sample-shopping-app
のIonicアプリをGitHub Pagesにプッシュしたので、下記URLを参照すれば、実際の画面をみることができる。