Which @angular/* package(s) are the source of the bug?
compiler-cli
Is this a regression?
No
Description
The following file:
import { AfterViewInit, ChangeDetectionStrategy, Component, Input, TemplateRef, ViewChild } from '@angular/core';
@Component({
selector: 'react-to-template-ref',
template: `
<ng-template #tmpl let-props="props">
<react-wrapper *ngIf="component" [component]="component" [props]="props"></react-wrapper>
</ng-template>
`,
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class ReactToTemplateRefComponent<C> implements AfterViewInit {
...
}Is compiled to:
import { ChangeDetectionStrategy, Component, Input, ViewChild } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "../react-wrapper/react-wrapper.component.tsx";
import * as i2 from "@angular/common";
export class ReactToTemplateRefComponent {
...
}
...But the ../react-wrapper/react-wrapper.component.tsx import does not work, this should be ../react-wrapper/react-wrapper.component.
I have fixed it temporarily with a patch:
diff --git a/bundles/chunk-BUHWADBP.js b/bundles/chunk-BUHWADBP.js
index 6ae014203a0a44090091c061342281a25708ce3b..b665323d307a5c457d094973738b7a43c65cb595 100755
--- a/bundles/chunk-BUHWADBP.js
+++ b/bundles/chunk-BUHWADBP.js
@@ -6444,6 +6444,17 @@ function incrementalFromStateTicket(oldProgram, oldState, newProgram, options, i
perfRecorder
};
}
+var TsxImportRewriter = class {
+ shouldImportSymbol(symbol, specifier) {
+ return true;
+ }
+ rewriteSymbol(symbol, specifier) {
+ return symbol;
+ }
+ rewriteSpecifier(specifier, inContextOfFile) {
+ return specifier.replace(/.tsx$/, '');
+ }
+};
var NgCompiler = class {
constructor(adapter, options, inputProgram, programDriver, incrementalStrategy, incrementalCompilation, enableTemplateTypeChecker, usePoisonedData, livePerfRecorder) {
this.adapter = adapter;
@@ -6640,7 +6651,8 @@ var NgCompiler = class {
if (coreImportsFrom !== null) {
importRewriter = new R3SymbolsImportRewriter(coreImportsFrom.fileName);
} else {
- importRewriter = new NoopImportRewriter();
+ // importRewriter = new NoopImportRewriter();
+ importRewriter = new TsxImportRewriter();
}
const defaultImportTracker = new DefaultImportTracker();
const before = [But I think the AST might already be wrong, as I think the .ts extensions are removed but the .tsx extensions aren't.
Please provide a link to a minimal reproduction of the bug
https://github.com/bubblydoo/angular-react/tree/fix-packaging
Please provide the exception or error you saw
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 13.3.10
Node: 18.12.1 (Unsupported)
Package Manager: yarn 3.4.1
OS: darwin arm64
Angular: 13.3.12
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1303.10
@angular-devkit/build-angular 13.3.10
@angular-devkit/core 13.3.10
@angular-devkit/schematics 13.3.10
@angular/cli 13.3.10
@schematics/angular 13.3.10
ng-packagr 13.3.1
rxjs 7.5.7
typescript 4.6.4
Anything else?
To reproduce the error, remove the @angular/compiler-cli field in the resolutions of package.json, then run npm run build
Which @angular/* package(s) are the source of the bug?
compiler-cli
Is this a regression?
No
Description
The following file:
Is compiled to:
But the
../react-wrapper/react-wrapper.component.tsximport does not work, this should be../react-wrapper/react-wrapper.component.I have fixed it temporarily with a patch:
But I think the AST might already be wrong, as I think the
.tsextensions are removed but the.tsxextensions aren't.Please provide a link to a minimal reproduction of the bug
https://github.com/bubblydoo/angular-react/tree/fix-packaging
Please provide the exception or error you saw
Please provide the environment you discovered this bug in (run
ng version)Anything else?
To reproduce the error, remove the
@angular/compiler-clifield in theresolutionsofpackage.json, then runnpm run build