web-dev-qa-db-ja.com

angular-cli-ghpagesを使用してAngular 4をGHページにデプロイする際のエラー

シンプルなAngular 4アプリをgh-pagesにデプロイしようとしています。いくつかの方法を試しましたが、angular-cli-ghpagesが最も新しい方法です。

Npm angular-cli-ghpages page の指示に従いました。

まず、angular-cli-ghpagesを正常にインストールしました。

$ Sudo npm i -g angular-cli-ghpages

このコマンドはSudoなしでは機能しません。

次に、distフォルダーを作成し、base-hrefを設定します。

$ ng build --prod --base-href " https://shanegibney.github.io/mathapp/ "

それから私は、

$ ngh

しかし、これはエラーになります、

出力は以下のこの画像で確認できます。

enter image description here

Nghの代わりにangular-cli-ghpagesを実行すると、同じエラーが発生します。

enter image description here

次のバージョンを使用していますが、

npm 3.10.10

angular-cli-ghpages ^ 0.5.1

ノード6.9.4（実際にはここでは問題ではありません）

ありがとう

angulardeploymentangular-cligithub-pages
11
Shane G

これを解決するには、package.jsonのスクリプトオブジェクトの最後に以下を追加します。

"scripts": {

   "deploy": "ng build --prod --base-href 
   https://shanegibney.github.io/mathapp/ && angular-cli-ghpages --branch 
   gh-pages"
}

そして走った

$Sudo npm run deploy

したがって、必要なのはオプションの「--branch gh-pages」だったようですが、angular-cli-ghpagesのnpmページにこれを示唆することは何もありません。

Package.jsonを経由せずにこれらのコマンドを個別に実行すると、動作しないことに気付きました。

$ Sudo ng build --prod --base-href https://shanegibney.github.io/mathapp/

$ Sudo angular-cli-ghpages --branch gh-pages

shermandigital.com の ブログ投稿 から助けを得た

6
Shane G

Gitプッシュ後Originマスターgh-ページデプロイステップ1： "ng build --prod --base-href https://username.github.io/project-name/ "

ステップ2： "ngh --dir dist/project-name"

プロジェクト名とユーザー名をgithubユーザー名、プロジェクト名に置き換えます

6
vbrgr

先週、Angular2アプリをgh-pagesにデプロイしました（ Live ）が、使用していません

angular-cli-ghpagesページ

これらの依存関係を使用-

  • @ angular/cli "：" ^ 1.2.0
  • @ angular/compiler-cli "：" ^ 2.3.1

次に、ミニファイルcssおよびjsとしてプロジェクトをビルドする必要があります。それを行うには、あなたのangularプロジェクトでこのコードを実行するだけです

ng build --prod--aot --base-href "https://username.github.io/repo-name/"

コンパイル時に問題が発生した場合は、angular-cli.jsonファイルのこのコードを置き換えてください。

"environments": {
  "source": "environments/environment.ts",
  "dev": "environments/environment.ts",
  "prod": "environments/environment.prod.ts"
}

に

"environmentSource": "environments/environment.ts",
"environments": {
  "dev": "environments/environment.ts",
  "prod": "environments/environment.prod.ts"
}

コンパイルが成功したら（100％）、このコマンドを実行してgh-pahesにデプロイします

ngh --message "Deploy gh pages"
5
Aruna Sanjeewa

私はコマンドをスーパーユーザーとして実行しましたが、うまくいきました。それを試してみてください。そうでない場合は、-no-silentを指定してコマンドを実行し、詳細を取得します。例：

Sudo angular-cli-ghpages --no-silent

3
Leonardo Soares e Silva