使用 GitHub Pages 来发布 Angular 应用的方法

我一直在寻找发布Angular应用程序的方法,但GitHub Pages是最简单的,所以这是我的备忘录。

angular-cli-ghpages 的意思是 Angular 命令行界面,用于将项目部署到 GitHub Pages。

angular-cli-ghpages というパッケージを使用します
angular-cli-ghpages を使うための条件は下記です

Node.js 4.x 以上
Git 1.7.6 以上
Angular CLI で作った Angular アプリケーションであること

今回は下記の環境で試しています

Node.js 8.9.0
Git 2.14.3
Angular CLI 1.5.4

使用方法

    angular-cli-ghpages をインストール
$ yarn global add angular-cli-ghpages
    今回公開したいリポジトリ名を angular-tour-of-heroes とします
$ cd angular-tour-of-heroes/
$ ng build --prod --base-href "https://kasaharu.github.io/angular-tour-of-heroes/"
$ angular-cli-ghpages
    • 上記コマンドを実行すると dist/ ディレクトリ配下が gh-pages ブランチとして push されます

コミットメッセージはデフォルト “Auto-generated commit”

只需要一个选择:
选项

    • ブランチ名を変えたい場合

下記のオプションで、 deploy ブランチに push します

$ angular-cli-ghpages --branch=deploy
    • コミットメッセージを変えたい場合

下記のオプションで、コミットメッセージを Deployment にします

$ angular-cli-ghpages --message="Deployment"
    dry-run
$ angular-cli-ghpages --dry-run

在GitHub Pages上发布

    • angular-cli-ghpages を使って gh-pages ブランチへの push まで済んでいるので、あとはリポジトリの設定を変えます

 

    Setting を選び、 GitHub Pages の項目で使用するブランチを gh-pages に変更するだけで完了です
gh-pages.png

确认

    公開したページ(https://kasaharu.github.io/angular-tour-of-heroes) を見ると、ちゃんとデプロイされています

请查看参考页面

    • angular-cli-ghpages – GitHub

 

    • Deploy to GitHub Pages

 

    Enabling GitHub Pages to publish your site from master or gh-pages
广告
将在 10 秒后关闭
bannerAds