[解決済み] CLIを使ったAngular 2 - 制作のためのビルド
2022-03-17 03:35:08
質問
angular-cli 1.0.0.beta.17(最新版)をインストールし、新しいプロジェクトを開始し、ポート4200でプロジェクトを問題なく提供することができました。
しかし、この空っぽの一般的なアプリケーションを本番用にビルドしようとすると、コマンド
ng build --prod
main.*.jsファイルが全く作成されず、以下のような警告が数画面表示されます。
- 未使用の関数を削除しました。
- 初期化におけるサイトエフェクト...
- その他
これは全く新しい空のプロジェクトで、まだ何も壊す機会がありませんでした...
製品版のビルド方法は?
解決方法は?
Angular v6+にアップデートしました。
# Prod - these are equivalent
ng build --configuration=production
ng build --c=production
ng build --prod=true
# Dev - and so are these
ng build --configuration=development
ng build --c=development
ng build --prod=false
ng build
その他のフラグ設定はこちら
https://angular.io/cli/build
Angular-cliのgithub wiki v2+によると、開発版と本番版のビルドを開始する最も一般的な方法は以下のとおりです。
# Prod these are equivalent
ng build --target=production --environment=prod
ng build --prod --env=prod
ng build --prod
# Dev and so are these
ng build --target=development --environment=dev
ng build --dev --env=dev
ng build --dev
ng build
dev と --prod のビルドに影響するデフォルトフラグは異なります。
Flag --dev --prod
--aot false true
--environment dev prod
--output-hashing media all
--sourcemaps true false
--extract-css false true
--prod
は、以下のフラグ不可の設定も行います。
-
で設定されている場合は、サービスワーカーを追加します。
.angular-cli.json
. -
置き換え
process.env.NODE_ENV
というモジュールでproduction
の値を変更します (これは react などの一部のライブラリで必要です)。 - コード上でUglifyJSを実行します。
AOTを動作させるために、トラブルシューティングを行う必要があります。実行したところ
ng build --prod --aot=false
のようなエラーが返されるでしょう。
Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory'
元々、AOTを動作させるためには、プロジェクトのリファクタリングを行う必要がありました。しかし、このエラーに遭遇した場合、それらは修正されるかもしれません。試す
<ブロッククオートnpm i [email protected]
関連
-
[解決済み] NGIf else "の使い方を教えてください。
-
[解決済み] モジュール "@angular-devkit/build-angular" が見つかりませんでした。
-
[解決済み] Angular CLI のグローバルバージョンがローカルバージョンより大きい
-
[解決済み] Angularアプリを本番用にバンドルする方法
-
[解決済み] Angular CLI SASSオプション
-
[解決済み】Angular CLIが生成する「spec.ts」ファイルは何のためにあるのか?
-
[解決済み】Angularでファイルアップロード?
-
[解決済み】angular-cliプロジェクトにbootstrapを追加する方法
-
[解決済み] Angular 2 http.post()がリクエストを送信しない
-
[解決済み] index.tsは何に使われているのですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] オブジェクトのキーと値に*ngForでアクセスする
-
[解決済み] Angular2の括弧、括弧、アスタリスクの違いは何ですか?
-
[解決済み] テンプレート駆動型とリアクティブ型の実用的な違いとは?
-
[解決済み] Angular + Material - データソース(mat-table)を更新する方法
-
[解決済み] Angular - "has no exported member 'Observable'" エクスポートされたメンバーがありません。
-
[解決済み] Angular 2 http.post()がリクエストを送信しない
-
[解決済み] index.tsは何に使われているのですか?
-
[解決済み] エラーが発生しました。出力が初期化されていません
-
[解決済み] テンプレート内の *ngIf else if
-
[解決済み] angular2 で入力を無効にする方法