Bug: [ngtools] Replace resource transformer issue with conditional `templateUrl`

オープン
#27,611 コメント 5 件 リアクション 0 件 担当者 0 名 GitHub で見る

まだ誰も着手していません。

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
68/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
静か
技術スタック
angular, typescript, webpack

調査の方向性

まず packages/ngtools/webpack/src/transformers/replace_resources_spec.ts を実行し、関連する replace_resources.ts transformer を読みます。失敗する conditional templateUrl の再現を使い、生成された ESM と CommonJS の出力を比較します。両方の形式で conditional resource が正しく変換され、テストがパスすれば完了です。

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

説明

area: @angular/build area: @ngtools/webpack freq1: low severity2: inconvenient type: bug/fix
Command

test

Is this a regression?
  • Yes, this behavior used to work in the previous version
The previous version in which this bug was not present was

No response

Description

When having conditional templateUrl like this

  templateUrl:
    true === true
        ? './dashboard.component.html'
        : './dashboard.component.copy.html',

replace_resources.ts couldn't transform into proper codes (either require or import)

Minimal Reproduction
// esm

//...
AppComponent = __decorate([
    Component({
        selector: 'app-root',
        templateUrl: true === true
            ? './app.component.html'
            : './app.component.copy.html',
        styles: [__NG_CLI_RESOURCE__0, __NG_CLI_RESOURCE__1]
    })
], AppComponent);
// commonjs

//...
exports.AppComponent = AppComponent = tslib_1.__decorate([
    (0, core_1.Component)({
        selector: 'app-root',
        templateUrl: true === true
            ? './app.component.html'
            : './app.component.copy.html',
        styles: [require("./app.component.css?ngResource"), require("./app.component.2.css?ngResource")]
    })
], AppComponent);
Exception or Error
Component 'AppComponent' is not resolved:
     - templateUrl: ./app.component.html
    Did you run and wait for 'resolveComponentResources()'?


### Your Environment

```text
Angular CLI: 17.3.6
Node: 20.12.2
Package Manager: yarn 1.22.17
OS: darwin x64

Angular: 18.0.0-rc.0
... animations, cdk, common, compiler, compiler-cli, core, forms
... localize, material, platform-browser
... platform-browser-dynamic, platform-server, router
... service-worker

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.0.0-EXPERIMENTAL-PLACEHOLDER
@angular-devkit/core         0.0.0-PLACEHOLDER
@angular-devkit/schematics   0.0.0-PLACEHOLDER
@angular/bazel               18.1.0-next.0+sha-1872fcd
@angular/build-tooling       0.0.0-e6e98d32d7d4d350ecf4ec10ad9c7e75198daabd
@angular/ng-dev              <error>
@schematics/angular          0.0.0-PLACEHOLDER
ng-packagr                   18.0.0-rc.0
rxjs                         7.8.1
typescript                   5.4.5
webpack                      5.91.0
zone.js                      0.14.4
Anything else relevant?

Related to this bug https://github.com/thymikee/jest-preset-angular/issues/1866

主要言語
TypeScript
スター
27k
フォーク
11.8k
平均マージ
16時間 35分
マージ済み PR(30日)
176

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

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

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

angular/angular-cli のほかの issue

angular/angular-cli の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

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

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