Utility to assist in fixing AOT compatibility issues in an Angular codebase.
The utility performs the following transformations:
-
Turns
private
properties/methods which are accessed by a html template intopublic
properties/methods (including anyprivate
constructor args accessed from the template).For example, the following component:
@Component( { selector: 'my-component', template: ` Hello, {{ worldText }}! ` } ) export class MyComponent { private worldText = "world"; private theAnswerToTheUniverse = 42; }
Is changed to:
@Component( { selector: 'my-component', template: ` Hello, {{ worldText }}! ` } ) export class MyComponent { public worldText = "world"; // <-- made `public` private theAnswerToTheUniverse = 42; // <-- remains as `private` }
-
Makes all
@HostListener
methods public -
If a
@HostListener
includes an argument, but the method does not expect one, then the argument is removed. Example:@HostListener( 'window.resize', [ '$event' ] ) onResize() { // ... }
Is changed to:
@HostListener( 'window.resize' ) onResize() { // ... }
Essentially every .html file is parsed looking for identifiers which correspond
to private
properties in your class, and they are converted to public
.
This utility makes modifications to the directory that you pass it. Make sure you are in a clean git (or other VCS) state before running it in case you need to revert!
npm install --global angular-aot-fixer
angular-aot-fixer path/to/your/project
TypeScript:
import { fixAotCompatibility, fixAotCompatibilitySync } from 'angular-aot-fixer';
// Async
fixAotCompatibility( 'path/to/component/files' ).then(
() => console.log( 'Done!' ),
( err ) => console.log( 'Error: ', err );
);
// Sync
fixAotCompatibilitySync( 'path/to/component/files' );
console.log( 'Done!' );
JavaScript:
const { fixAotCompatibility, fixAotCompatibilitySync } = require( 'angular-aot-fixer' );
// Async
fixAotCompatibility( 'path/to/component/files' ).then(
() => console.log( 'Done!' ),
( err ) => console.log( 'Error: ', err );
);
// Sync
fixAotCompatibilitySync( 'path/to/component/files' );
console.log( 'Done!' );
Make sure you have Node.js installed.
Clone the git repo:
git clone https://github.com/gregjacobs/angular-aot-fixer.git
cd angular-aot-fixer
Install dependencies:
npm install
Run Tests:
npm test