angular / angular/angular-cli

Show compile-time error/warning for using `@angular/compiler` with optimized builds

オープン
#19,016 コメント 2 件 リアクション 0 件 担当者 0 名 GitHub で見る
area: @angular-devkit/build-angular devkit/build-angular:browser feature feature: insufficient votes severity1: confusing workaround2: non-obvious
主要言語
TypeScript
スター
27k
フォーク
11.8k
平均マージ
14時間 23分
マージ済み PR(30日)
162

説明

# 🚀 Feature request

### Command (mark with an `x`)
- [X] build

### Description
Currently it is possible to have a configuration which uses AOT compilations but also JIT during runtime and attempts to run build optimizer on the results. This doesn't really work and isn't supported, leading to awkward error messages, which can be confusing to users (see #17663).

### Describe the solution you'd like
Ideally, the CLI would detect this case and error out if an import for `@angular/compiler` is found in user code with build optimizer enabled. We should display a more precise warning/error about this case to better explain to the users why JIT + build optimizer doesn't work and what they can to do fix it.

### Describe alternatives you've considered
Currently this is a runtime error with a poor message.

```
main.7000374ef126bad8069c.js:1 ERROR Error: Uncaught (in promise): Error: Angular JIT compilation failed: '@angular/compiler' not loaded!
- JIT compilation is discouraged for production use-cases! Consider AOT mode instead.
- Did you bootstrap using '@angular/platform-browser-dynamic' or '@angular/platform-server'?
- Alternatively provide the compiler with 'import "@angular/compiler";' before bootstrapping.
Error: Angular JIT compilation failed: '@angular/compiler' not loaded!
- JIT compilation is discouraged for production use-cases! Consider AOT mode instead.
- Did you bootstrap using '@angular/platform-browser-dynamic' or '@angular/platform-server'?
- Alternatively provide the compiler with 'import "@angular/compiler";' before bootstrapping.
at Ae (main.7000374ef126bad8069c.js:1)
at Function.get (main.7000374ef126bad8069c.js:1)
at St (main.7000374ef126bad8069c.js:1)
at new Af (main.7000374ef126bad8069c.js:1)
at ud (main.7000374ef126bad8069c.js:1)
at dd (main.7000374ef126bad8069c.js:1)
at e.md [as compileModuleAndAllComponentsAsync] (main.7000374ef126bad8069c.js:1)
at e. (main.7000374ef126bad8069c.js:1)
at Generator.next ()
at main.7000374ef126bad8069c.js:1
at T (polyfills.a8d522dff2c1a5c4b9db.js:1)
at polyfills.a8d522dff2c1a5c4b9db.js:1
at a (main.7000374ef126bad8069c.js:1)
at l.invoke (polyfills.a8d522dff2c1a5c4b9db.js:1)
at Object.onInvoke (main.7000374ef126bad8069c.js:1)
at l.invoke (polyfills.a8d522dff2c1a5c4b9db.js:1)
at i.run (polyfills.a8d522dff2c1a5c4b9db.js:1)
at polyfills.a8d522dff2c1a5c4b9db.js:1
at l.invokeTask (polyfills.a8d522dff2c1a5c4b9db.js:1)
at Object.onInvokeTask (main.7000374ef126bad8069c.js:1)
```

コントリビューションガイド

コントリビューションガイドを開く

調査の方向性

まず、最適化ビルドにおける Angular CLI のビルドパスと、@angular/compiler のユーザーによるインポートをどのように処理するかを追跡します。完了の定義は、ビルド中にその組み合わせを検出し、JIT/build-optimizer の非互換性と利用可能な修正方法を説明する、正確な警告またはエラーを報告することとします。

索引モデルが issue の本文から書いたものです。

評価

技術スタック
angular, typescript
領域
build-system, cli
issue の種類
機能追加
難易度
4/5
見積もり時間
3〜5日
活発さ
停滞
明瞭さ
おおむね明確
初心者へのやさしさ
35/100

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。