タグ付けされた質問 「angular-cli」

Angular 5.2アプリをAngular 6に更新しようとしています。Angular更新ガイド（angular-cliv6への更新を含む）の指示に従って正常に実行し、今からアプリを提供しようとしています ng serve --env=local しかし、これは私にエラーを与えます： 不明なオプション： '--env' 私は複数の環境（dev/local/prod）を使用していますが、これはAngular 5.2で機能していた方法です。Angular 6で環境を設定するにはどうすればよいですか？

169 angular  angular6  angular-cli 

入力する必要がないように、構成ファイルでホストとポートを設定できるかどうかを知りたい ng serve --host foo.bar --port 80 ただの代わりに ng serve

166 angular  angular-cli 

このエラーが発生しています Angular Compilerのエラーには、TypeScript> = 3.1.1および<3.2.0が必要ですが、代わりに3.2.1が見つかりました。 Typescriptが更新されたようですが、Angular Compilerはそうではありません。 どうすれば修正できますか？

159 angular  typescript  npm  angular-cli 

端末コマンドng serverまたはを実行すると、ng serve --live-reload=true次の問題が発生します。 serveコマンドは、Angularプロジェクトで実行する必要がありますが、プロジェクト定義が見つかりませんでした。

158 angular  angular5  angular-cli 

ng serve Angularプロジェクトを開発サーバー経由で提供する npm startパッケージの「scripts」オブジェクトの「start」プロパティで指定された任意のコマンドを実行します。「スクリプト」オブジェクトで「開始」プロパティが指定されていない場合、ノードserver.jsが実行されます。 ng serve組み込みサーバーをnpm start起動するのに対し、ノードサーバーを起動するようです。 誰かがそれに光を当てることはできますか？

157 angular  angular-cli 

Angular 4.1.0コンポーネントをテストしようとしています- export class CellComponent implements OnInit { lines: Observable<Array<ILine>>; @Input() dep: string; @Input() embedded: boolean; @Input() dashboard: boolean; constructor( public dataService: CellService, private route: ActivatedRoute, private router: Router, private store: Store<AppStore>) { } } ただし、単純な「should create」テストでは、この不可解なエラーがスローされます... NetworkError：「XMLHttpRequest」で「send」を実行できませんでした：「ng：///DynamicTestModule/module.ngfactory.js」をロードできませんでした。 だから私はこの質問を見つけました、それは問題がコンポーネントが@Input)_設定されていないparamsを持っていることを示唆しています、しかし私が私のように私のテストを変更した場合： it('should create', inject([CellComponent], (cmp: CellComponent) => { cmp.dep = ''; cmp.embedded …

145 angular  unit-testing  karma-jasmine  angular-cli 

Angular-CLI（ベータ20）でビルドされたAngular2プロジェクトがあります。 選択した1つのスペックファイルのみに対してテストを実行する方法はありますか？ 以前はAngular2クイックスタートに基づくプロジェクトを使用しており、jasmineファイルに手動でスペックを追加できました。しかし、カルマテスト以外でこれを設定する方法や、Angular-CLIビルドでカルマテストを特定のファイルに制限する方法がわかりません。

143 angular  jasmine  angular-cli 

Angular CLIでAngle 2 Appを作成したい 私はcmdに書いています： npm install angular-cli -g 次に： ng firstngapp npm startと書くとエラーが表示されます！ 問題がわかりません

140 angular  npm  angular-cli 

Angular CLIで設定されているデフォルトのファビコンを変更するにはどうすればよいですか？ 多くのことを試しましたが、アイコン（srcフォルダー内のfavicon.ico）を削除しても、Angularロゴは常にファビコンとして表示されます。それはまだ表示され、どこから読み込まれたのかわかりません。 そのアイコンを別のアイコンに置き換えましたが、まだAngularロゴが表示されています。 <link rel="icon" type="image/x-icon" href="favicon.ico">

140 angular-cli 

ng testテストスイート全体ではなく単一のファイルに対して実行する方法はありますか？理想的には、ファイルを編集しているときにできるだけ早くフィードバックループを取得したいのですkarmaが、保存ごとにスイート全体を実行します。これは、十分に大きなテストスイートを構築すると少し遅くなります。 これは、angular-cliで1つのテスト仕様のみを実行する方法とは異なります。その質問は、個々の仕様の実行に関するものです。これは、個々のファイルを実行することです。ソリューションには同じJasmine仕様機能が含まれていますが、質問の性質は少し異なります。

138 angular  jasmine  angular-cli  karma-runner 

ドキュメントを読みました。使用したい場合はscss、次のコマンドを実行する必要があります。 ng set defaults.styleExt scss しかし、それを実行してそのファイルを作成しても、コンソールにこのエラーが表示されます。 styles.bundle.js:33Uncaught Error: Module build failed: Error: ENOENT: no such file or directory, open '/Users/Egen/Code/angular/src/styles.css'(…)

135 css  angular  sass  angular6  angular-cli 

私は初期化されたシンプルなアプリを持っています angular-cli。 3つのルートに関連するいくつかのページを表示します。3つのコンポーネントがあります。このページのIの使用のいずれかにlodashいくつかのデータを取得するために、角2 HTTPモジュール（RxJS使用してObservableSを、mapとsubscribe）。単純なを使用してこれらの要素を表示します*ngFor。 しかし、私のアプリは本当にシンプルであるにもかかわらず、私は（私の意見では）巨大なバンドルパッケージとマップを取得しています。私はgzipのバージョンについては話しませんが、gzipする前のサイズです。この質問は、一般的な推奨事項の問い合わせです。 一部のテスト結果： ビルド ハッシュ：8efac7d6208adb8641c1時間：10129msチャンク{0} main.bundle.js、main.bundle.map（main）18.7 kB {3} [初期] [レンダリング] チャンク{1} styles.bundle.css、styles.bundle.map、styles.bundle.map（styles）155 kB {4} [初期] [レンダリング] チャンク{2} scripts.bundle.js、scripts.bundle.map（scripts）128 kB {4} [初期] [レンダリング] チャンク{3} vendor.bundle.js、vendor.bundle.map（vendor）3.96 MB [初期] [レンダリング] チャンク{4} inline.bundle.js、inline.bundle.map（inline）0バイト[エントリ] [レンダリング] 待つ：そのような単純なアプリ用の10Mbベンダーバンドルパッケージ？ ng build --prod ハッシュ：09a5f095e33b2980e7cc時間：23455ミリ秒のチャンク{0} main.6273b0f04a07a1c2ad6c.bundle.js、main.6273b0f04a07a1c2ad6c.bundle.map（main）18.3 kB {3} [初期] [レンダリング] チャンク{1} styles.bfdaa4d8a4eb2d0cb019.bundle.css、styles.bfdaa4d8a4eb2d0cb019.bundle.map、styles.bfdaa4d8a4eb2d0cb019.bundle.map（styles）154 kB {4} [初期] チャンク{2} scripts.c5b720a078e5464ec211.bundle.js、scripts.c5b720a078e5464ec211.bundle.map（scripts）128 …

135 angular  webpack  angular-cli 

2018年5月24日更新：元の投稿から+3バージョンのAngularになりましたが、まだ実行可能な最終的なソリューションはありません。Lars Meijdam（@LarsMeijdam）は、一見の価値のある興味深いアプローチを考え出しました。（プロプライエタリな問題のため、彼は最初にサンプルを投稿したGitHubリポジトリを一時的に削除する必要がありました。ただし、コピーが必要な場合は、直接彼にメッセージを送ることができます。詳細については、以下のコメントを参照してください。） Angular 6の最近のアーキテクチャの変更により、ソリューションに近づくことができます。さらに、Angular Elements（https://angular.io/guide/elements）はいくつかのコンポーネント機能を提供します。 すばらしいAngularチームの誰かがこれに遭遇した場合、この機能に非常に興味を持っている他の多くの人々がいるように見えることに注意してください。バックログを検討する価値があるかもしれません。 私はでプラガブル（プラグイン）フレームワークを実装したいと思いAngular 2、Angular 4、Angular 5、またはAngular 6アプリケーション。 （このプラグイン可能なフレームワークを開発するための私の特定のユースケースは、ミニチュアコンテンツ管理システムを開発する必要があるということです。ここで詳しく説明されていないいくつかの理由によりAngular 2/4/5/6、そのシステムのほとんどのニーズにほぼ完全に適合します。） プラグイン可能なフレームワーク（またはプラグインアーキテクチャ）とは、具体的には、サードパーティの開発者が、プライマリアプリケーションのソースコードに直接アクセスしたり、その知識を持たなくても、プラグイン可能なコンポーネントを使用してプライマリアプリケーションの機能を作成または拡張できるシステムを意味しますまたは内部の仕組み。 （「アプリケーションのソースコードや内部の仕組みに直接アクセスしたり、その知識を持たない」という表現は、中心的な目的です。） プラグイン可能なフレームワークの例には、WordPressまたはなどの一般的なコンテンツ管理システムが含まれますDrupal。 （Drupalと同様に）理想的な状況は、これらのプラグイン可能なコンポーネント（またはプラグイン）をフォルダーに簡単に配置し、アプリケーションにそれらを自動検出または検出させ、魔法のように「機能」させることです。これをある種のホットプラグ可能な方法で、つまりアプリの実行中に行うのが最適です。 私は現在、次の5つの質問に対する回答を（あなたの助けを借りて）決定しようとしています。 実用性：Angular 2/4/5/6アプリケーションのプラグインフレームワークは実用的ですか？（これまで、を使用して真にプラグイン可能なフレームワークを作成する実用的な方法はありませんでしたAngular2/4/5/6。） 予想される課題：Angular 2/4/5/6アプリケーションのプラグインフレームワークの実装で遭遇する可能性のある課題は何ですか？ 実装戦略：Angular 2/4/5/6アプリケーションのプラグインフレームワークを実装するために使用できる特定の技術または戦略は何ですか？ ベストプラクティス：Angular 2/4/5/6アプリケーションのプラグインシステムを実装するためのベストプラクティスは何ですか？ 代替技術： プラグインフレームワークがアプリケーションで実用的でない場合、どのような比較的同等の技術（例）が、最新の非常に反応性の高いWebアプリケーションに適しているでしょうか？Angular 2/4/5/6React 一般に、次のAngular 2/4/5/6理由により、の使用は非常に望ましいです。 当然のことながら、非常に高速です。 帯域幅をほとんど消費しません（初期ロード後） フットプリントが比較的小さい（後AOTとtree shaking）-そしてそのフットプリントは縮小し続けています それは非常に機能的であり、Angularチームとコミュニティはそのエコシステムの急速な成長を続けています それは、次のような最高の、最新のWeb技術の多くとよく果たしているTypeScriptとObservables Angular 5はサービスワーカーをサポートするようになりました（https://medium.com/@webmaxru/a-new-angular-service-worker-creating-automatic-progressive-web-apps-part-1-theory-37d7d7647cc7） によってGoogleサポートされているため、将来的にはサポートおよび拡張される可能性があります Angular 2/4/5/6現在のプロジェクトで使用したいです。を使用できる場合は、おそらく（サーバー側のレンダリングに）Angular 2/4/5/6も使用します。Angular-CLIAngular Universal 上記の質問に関するこれまでの私の考えは次のとおりです。フィードバックと啓発を確認して提供してください。 Angular 2/4/5/6アプリはパッケージを消費しますが、これは必ずしもアプリケーション内でプラグインを許可することと同じではありません。他のシステム（例Drupal：）のプラグインは、システムによって自動的に「ピックアップ」される共通モジュールディレクトリにプラグインフォルダーをドロップすることで基本的に追加できます。ではAngular 2/4/5/6、（プラグインとして）パッケージは通常を介してインストールされnpm、に追加されてから、package.json手動でアプリにインポートされapp.moduleます。これはDrupal、フォルダーをドロップしてシステムにパッケージを自動的に検出させる方法よりもはるかに複雑です。プラグインのインストールが複雑になるほど、人々がプラグインを使用する可能性は低くなります。のための方法があった場合、それははるかに良いでしょうAngular 2/4/5/6プラグインを自動的に検出してインストールします。開発者以外がAngular 2/4/5/6アプリケーションをインストールし、アプリケーションのアーキテクチャをすべて理解する必要なく、選択したプラグインをインストールできる方法を見つけることに非常に興味があります。 …

133 angular  plugins  angular-cli  angular-universal 

更新：2018年12月（「Aniket」の回答を参照） Angular CLI 6を使用する場合は、ng排出が非推奨であり、8.0で間もなく削除されるため、ビルダーを使用する必要があります。 更新：2018年6月：Angular 6はngの取り出しをサポートしていません** 更新：2017年2月：NGイジェクトを使用 更新：2016年11月：angular-cliはwebpackのみを使用するようになりました。通常はnpm install -g angular-cliを使用してインストールするだけです。「私たちはビルドシステムをbeta.10とbeta.14の間でSystemJSからWebpackに変更しました。」しかし、実際には構造とフォルダーの最初だけにangular-cliを使用し、その後、手動でwebpack configを使用しています 私はこれでangular cliをインストールしました： npm install -g angular-cli@webpack angular1とweb packを使用していたときに、「webpack.config.js」ファイルを変更してすべてのタスクとプラグインを実行していましたが、angular-cliを使用して作成されたこのプロジェクトで、誰が機能するのかわかりません。魔法です？ 私が行うときにWebpackが機能しているのがわかります： ng serve "Version: webpack 2.1.0-beta.18" しかし、私はangular-cli構成が機能する方法を理解していません...

132 angular  webpack  angular-cli 

ng serveコマンドでangular-cliを使用して、デフォルトのポートを指定して、--port毎回手動でフラグを渡す必要がないようにするにはどうすればよいですか？ デフォルトのポート4200から変更したい。

130 angular  angular-cli