2019-07-24 19:58:42 +00:00
# Angular compiler options
2022-10-03 21:44:40 +00:00
When you use [ahead-of-time compilation (AOT) ](guide/aot-compiler ), you can control how your application is compiled by specifying *template* compiler options in the [TypeScript configuration file ](guide/typescript-configuration ).
2019-07-24 19:58:42 +00:00
The template options object, `angularCompilerOptions` , is a sibling to the `compilerOptions` object that supplies standard options to the TypeScript compiler.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
< code-example header = "tsconfig.json" path = "angular-compiler-options/tsconfig.json" region = "angular-compiler-options" > < / code-example >
2019-08-06 21:31:01 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
< a id = "tsconfig-extends" > < / a >
2021-09-13 22:24:00 +00:00
2019-08-06 21:31:01 +00:00
## Configuration inheritance with extends
2021-07-24 13:00:43 +00:00
Like the TypeScript compiler, the Angular AOT compiler also supports `extends` in the `angularCompilerOptions` section of the TypeScript configuration file.
2019-08-06 21:31:01 +00:00
The `extends` property is at the top level, parallel to `compilerOptions` and `angularCompilerOptions` .
A TypeScript configuration can inherit settings from another file using the `extends` property.
2020-05-20 15:54:39 +00:00
The configuration options from the base file are loaded first, then overridden by those in the inheriting configuration file.
2019-08-06 21:31:01 +00:00
For example:
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
< code-example header = "tsconfig.app.json" path = "angular-compiler-options/tsconfig.app.json" region = "angular-compiler-options-app" > < / code-example >
2019-08-06 21:31:01 +00:00
2019-09-28 12:26:38 +00:00
For more information, see the [TypeScript Handbook ](https://www.typescriptlang.org/docs/handbook/tsconfig-json.html ).
2019-08-06 21:31:01 +00:00
## Template options
2020-02-03 01:49:28 +00:00
The following options are available for configuring the AOT template compiler.
2019-07-24 19:58:42 +00:00
### `annotationsAs`
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Modifies how Angular-specific annotations are emitted to improve tree-shaking.
Non-Angular annotations are not affected.
2023-04-19 09:17:03 +00:00
One of `static fields` or `decorators` . The default value is `static fields` .
2019-07-24 19:58:42 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
* By default, the compiler replaces decorators with a static field in the class, which allows advanced tree-shakers like [Closure compiler ](https://github.com/google/closure-compiler ) to remove unused classes
* The `decorators` value leaves the decorators in place, which makes compilation faster.
TypeScript emits calls to the `__decorate` helper.
Use `--emitDecoratorMetadata` for runtime reflection.
< div class = "alert is-helpful" >
**NOTE** : < br />
2022-08-28 09:33:56 +00:00
That the resulting code cannot tree-shake properly.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
< / div >
2019-07-24 19:58:42 +00:00
### `annotateForClosureCompiler`
2022-10-03 21:44:40 +00:00
<!-- vale Angular.Angular_Spelling = NO -->
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
When `true` , use [Tsickle ](https://github.com/angular/tsickle ) to annotate the emitted JavaScript with [JSDoc ](https://jsdoc.app ) comments needed by the [Closure Compiler ](https://github.com/google/closure-compiler ).
Default is `false` .
2019-07-24 19:58:42 +00:00
2022-10-03 21:44:40 +00:00
<!-- vale Angular.Angular_Spelling = YES -->
2021-04-08 20:34:31 +00:00
### `compilationMode`
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Specifies the compilation mode to use.
The following modes are available:
2021-04-08 20:34:31 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
| Modes | Details |
|:--- |:--- |
| `'full'` | Generates fully AOT-compiled code according to the version of Angular that is currently being used. |
| `'partial'` | Generates code in a stable, but intermediate form suitable for a published library. |
2021-04-08 20:34:31 +00:00
The default value is `'full'` .
2019-07-24 19:58:42 +00:00
### `disableExpressionLowering`
2022-10-03 21:44:40 +00:00
When `true` , the default, transforms code that is or could be used in an annotation, to allow it to be imported from template factory modules.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
See [metadata rewriting ](guide/aot-compiler#metadata-rewriting ) for more information.
2019-07-24 19:58:42 +00:00
When `false` , disables this rewriting, requiring the rewriting to be done manually.
### `disableTypeScriptVersionCheck`
2022-10-03 21:44:40 +00:00
When `true` , the compiler does not look at the TypeScript version and does not report an error when an unsupported version of TypeScript is used.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Not recommended, as unsupported versions of TypeScript might have undefined behavior.
Default is `false` .
2019-07-24 19:58:42 +00:00
2020-10-27 15:16:55 +00:00
### `enableI18nLegacyMessageIdFormat`
2022-10-03 21:44:40 +00:00
Instructs the Angular template compiler to create legacy ids for messages that are tagged in templates by the `i18n` attribute.
2021-10-12 23:08:16 +00:00
See [Mark text for translations][AioGuideI18nCommonPrepareMarkTextInComponentTemplate] for more information about marking messages for localization.
2020-10-27 15:16:55 +00:00
2022-10-03 21:44:40 +00:00
Set this option to `false` unless your project relies upon translations that were created earlier using legacy IDs.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Default is `true` .
2020-10-27 15:16:55 +00:00
2022-10-03 21:44:40 +00:00
The pre-Ivy message extraction tooling created a variety of legacy formats for extracted message IDs.
These message formats have some issues, such as whitespace handling and reliance upon information inside the original HTML of a template.
2020-10-27 15:16:55 +00:00
2022-10-03 21:44:40 +00:00
The new message format is more resilient to whitespace changes, is the same across all translation file formats, and can be created directly from calls to `$localize` .
2021-09-14 19:09:12 +00:00
This allows `$localize` messages in application code to use the same ID as identical `i18n` messages in component templates.
2020-10-27 15:16:55 +00:00
2019-07-24 19:58:42 +00:00
### `enableResourceInlining`
2022-08-28 09:33:56 +00:00
When `true` , replaces the `templateUrl` and `styleUrls` properties in all `@Component` decorators with inline content in the `template` and `styles` properties.
2019-07-24 19:58:42 +00:00
When enabled, the `.js` output of `ngc` does not include any lazy-loaded template or style URLs.
2022-10-03 21:44:40 +00:00
For library projects created with the Angular CLI, the development configuration default is `true` .
2019-11-04 18:10:56 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
< a id = "enablelegacytemplate" > < / a >
2019-07-24 19:58:42 +00:00
### `enableLegacyTemplate`
2022-10-03 21:44:40 +00:00
When `true` , enables the deprecated `<template>` element in place of `<ng-template>` .
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Default is `false` .
Might be required by some third-party Angular libraries.
2019-07-24 19:58:42 +00:00
### `flatModuleId`
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
The module ID to use for importing a flat module \(when `flatModuleOutFile` is `true` \).
2022-10-03 21:44:40 +00:00
References created by the template compiler use this module name when importing symbols from the flat module.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Ignored if `flatModuleOutFile` is `false` .
2019-07-24 19:58:42 +00:00
### `flatModuleOutFile`
2022-08-28 09:33:56 +00:00
When `true` , generates a flat module index of the given filename and the corresponding flat module metadata.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Use to create flat modules that are packaged similarly to `@angular/core` and `@angular/common` .
2022-10-03 21:44:40 +00:00
When this option is used, the `package.json` for the library should refer to the created flat module index instead of the library index file.
2019-07-24 19:58:42 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Produces only one `.metadata.json` file, which contains all the metadata necessary for symbols exported from the library index.
2023-07-19 14:06:24 +00:00
In the created `.ngfactory.js` files, the flat module index is used to import symbols. Symbols that include both the public API from the library index and shrouded internal symbols.
2019-07-24 19:58:42 +00:00
2023-07-19 14:06:24 +00:00
By default, the `.ts` file supplied in the `files` field is assumed to be the library index.
2019-07-24 19:58:42 +00:00
If more than one `.ts` file is specified, `libraryIndex` is used to select the file to use.
If more than one `.ts` file is supplied without a `libraryIndex` , an error is produced.
A flat module index `.d.ts` and `.js` is created with the given `flatModuleOutFile` name in the same location as the library index `.d.ts` file.
For example, if a library uses the `public_api.ts` file as the library index of the module, the `tsconfig.json` `files` field would be `["public_api.ts"]` .
2022-10-03 21:44:40 +00:00
The `flatModuleOutFile` option could then be set, for example, to `"index.js"` , which produces `index.d.ts` and `index.metadata.json` files.
2021-09-13 22:24:00 +00:00
The `module` field of the library's `package.json` would be `"index.js"` and the `typings` field would be `"index.d.ts"` .
2019-07-24 19:58:42 +00:00
### `fullTemplateTypeCheck`
2022-10-03 21:44:40 +00:00
When `true` , the recommended value, enables the [binding expression validation ](guide/aot-compiler#binding-expression-validation ) phase of the template compiler. This phase uses TypeScript to verify binding expressions.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
For more information, see [Template type checking ](guide/template-typecheck ).
2019-07-24 19:58:42 +00:00
2023-10-25 16:38:03 +00:00
Default is `false` , but set to `true` in the created workspace configuration when creating a project using the Angular CLI.
2019-07-24 19:58:42 +00:00
refactor(compiler-cli): deprecate the `fullTemplateTypeCheck` compiler option (#43224)
When compiling your application using the AOT compiler, your templates
are type-checked according to a certain strictness level. Before Angular 9
there existed only two strictness levels of template type checking as
determined by [the `fullTemplateTypeCheck` compiler option](guide/angular-compiler-options).
In version 9 the `strictTemplates` family of compiler options has been
introduced as a more fine-grained approach to configuring how strict your
templates are being type-checked.
The `fullTemplateTypeCheck` flag is being deprecated in favor of the new
`strictTemplates` option and its related compiler options. Projects that
currently have `fullTemplateTypeCheck: true` configured can migrate to
the following set of compiler options to achieve the same level of
type-checking.
```json
{
"angularCompilerOptions": {
"strictTemplates": true,
"strictInputTypes": false,
"strictNullInputTypes": false,
"strictAttributeTypes": false,
"strictOutputEventTypes": false,
"strictDomEventTypes": false,
"strictDomLocalRefTypes": false,
"strictSafeNavigationTypes": false,
"strictContextGenerics": false,
}
}
```
PR Close #43224
2021-08-22 19:33:00 +00:00
< div class = "alert is-important" >
The `fullTemplateTypeCheck` option has been deprecated in Angular 13 in favor of the `strictTemplates` family of compiler options.
< / div >
2019-07-24 19:58:42 +00:00
### `generateCodeForLibraries`
2022-10-03 21:44:40 +00:00
When `true` , creates factory files \(`.ngfactory.js` and `.ngstyle.js` \) for `.d.ts` files with a corresponding `.metadata.json` file. The default value is `true` .
2019-07-24 19:58:42 +00:00
2022-10-03 21:44:40 +00:00
When `false` , factory files are created only for `.ts` files.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Do this when using factory summaries.
2019-07-24 19:58:42 +00:00
### `preserveWhitespaces`
2022-10-03 21:44:40 +00:00
When `false` , the default, removes blank text nodes from compiled templates, which results in smaller emitted template factory modules.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Set to `true` to preserve blank text nodes.
2019-07-24 19:58:42 +00:00
2023-04-18 14:26:36 +00:00
< div class = "alert is-helpful" >
2023-04-19 09:17:03 +00:00
When using hydration, it is recommended that you use `preserveWhitespaces: false` , which is the default value. If you choose to enable preserving whitespaces by adding `preserveWhitespaces: true` to your tsconfig, it is possible you may encounter issues with hydration. This is not yet a fully supported configuration. Ensure this is also consistently set between the server and client tsconfig files. See the [hydration guide ](guide/hydration#preserve-whitespaces ) for more details.
2023-04-18 14:26:36 +00:00
< / div >
2019-07-24 19:58:42 +00:00
### `skipMetadataEmit`
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
When `true` , does not produce `.metadata.json` files.
Default is `false` .
2019-07-24 19:58:42 +00:00
2021-09-13 22:24:00 +00:00
The `.metadata.json` files contain information needed by the template compiler from a `.ts` file that is not included in the `.d.ts` file produced by the TypeScript compiler.
2022-10-03 21:44:40 +00:00
This information includes, for example, the content of annotations, such as a component's template, which TypeScript emits to the `.js` file but not to the `.d.ts` file.
2019-07-24 19:58:42 +00:00
2021-09-13 22:24:00 +00:00
You can set to `true` when using factory summaries, because the factory summaries include a copy of the information that is in the `.metadata.json` file.
2019-07-24 19:58:42 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Set to `true` if you are using TypeScript's `--outFile` option, because the metadata files are not valid for this style of TypeScript output.
2022-10-03 21:44:40 +00:00
The Angular community does not recommend using `--outFile` with Angular.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Use a bundler, such as [webpack ](https://webpack.js.org ), instead.
2019-07-24 19:58:42 +00:00
### `skipTemplateCodegen`
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
When `true` , does not emit `.ngfactory.js` and `.ngstyle.js` files.
This turns off most of the template compiler and disables the reporting of template diagnostics.
2019-07-24 19:58:42 +00:00
2022-10-03 21:44:40 +00:00
Can be used to instruct the template compiler to produce `.metadata.json` files for distribution with an `npm` package. This avoids the production of `.ngfactory.js` and `.ngstyle.js` files that cannot be distributed to `npm` .
2019-07-24 19:58:42 +00:00
2022-10-03 21:44:40 +00:00
For library projects created with the Angular CLI, the development configuration default is `true` .
2019-11-04 18:10:56 +00:00
2019-07-24 19:58:42 +00:00
### `strictMetadataEmit`
2019-11-23 17:35:23 +00:00
When `true` , reports an error to the `.metadata.json` file if `"skipMetadataEmit"` is `false` .
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
Default is `false` .
Use only when `"skipMetadataEmit"` is `false` and `"skipTemplateCodegen"` is `true` .
2019-07-24 19:58:42 +00:00
2022-10-03 21:44:40 +00:00
This option is intended to verify the `.metadata.json` files emitted for bundling with an `npm` package.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
The validation is strict and can emit errors for metadata that would never produce an error when used by the template compiler.
You can choose to suppress the error emitted by this option for an exported symbol by including `@dynamic` in the comment documenting the symbol.
2019-07-24 19:58:42 +00:00
It is valid for `.metadata.json` files to contain errors.
The template compiler reports these errors if the metadata is used to determine the contents of an annotation.
2022-10-03 21:44:40 +00:00
The metadata collector cannot predict the symbols that are designed for use in an annotation. It preemptively includes error nodes in the metadata for the exported symbols.
2019-07-24 19:58:42 +00:00
The template compiler can then use the error nodes to report an error if these symbols are used.
2022-10-03 21:44:40 +00:00
If the client of a library intends to use a symbol in an annotation, the template compiler does not normally report this. It gets reported after the client actually uses the symbol.
2021-09-13 22:24:00 +00:00
This option allows detection of these errors during the build phase of the library and is used, for example, in producing Angular libraries themselves.
2019-07-24 19:58:42 +00:00
2022-10-03 21:44:40 +00:00
For library projects created with the Angular CLI, the development configuration default is `true` .
2019-11-04 18:10:56 +00:00
2019-07-24 19:58:42 +00:00
### `strictInjectionParameters`
2022-10-03 21:44:40 +00:00
When `true` , reports an error for a supplied parameter whose injection type cannot be determined.
When `false` , constructor parameters of classes marked with `@Injectable` whose type cannot be resolved produce a warning.
The recommended value is `true` , but the default value is `false` .
2019-07-24 19:58:42 +00:00
2023-10-25 16:38:03 +00:00
Set to `true` in the created workspace configuration when creating a project using the Angular CLI.
2019-11-04 18:10:56 +00:00
### `strictTemplates`
2021-10-15 19:12:45 +00:00
When `true` , enables [strict template type checking ](guide/template-typecheck#strict-mode ).
2019-11-04 18:10:56 +00:00
2023-02-15 18:31:46 +00:00
The strictness flags that this option enables allow you to turn on and off specific types of strict template type checking.
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
See [troubleshooting template errors ](guide/template-typecheck#troubleshooting-template-errors ).
2019-11-04 18:10:56 +00:00
2023-10-25 16:38:03 +00:00
Set to `true` in the created workspace configuration when creating a project using the Angular CLI.
2019-11-04 18:10:56 +00:00
2019-07-24 19:58:42 +00:00
### `trace`
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
When `true` , prints extra information while compiling templates.
Default is `false` .
2021-05-26 22:32:29 +00:00
docs: improve markdown (#45325)
The purpose of the changes is to clean all markdown to match a single pedantic style.
* To ensure all changes in style are properly separated.
* To ensure all styled content aligns to nearest 4-character-tab.
* To ensure all code blocks use the Angular `<code-example>` or `<code-tab>` elements.
* To ensure all markdown exists outside of html tags.
* To ensure all images use the Angular style for `<img>` elements.
* To ensure that all smart punctuation is replaced or removed.
```text
’, ’, “, ”, –, —, …
```
* To ensure all content does not conflict with the following reserved characters.
```text
@, $, *, &, #, |, <, >,
```
* To ensure all content displays using html entities.
The following changes were made to files in the following directory.
```text
aio/content
```
The target files were markdown files.
The list of excluded files:
```text
.browserslistrc, .css, .conf, .editorconfig, .gitignore, .html, .js, .json, .sh, .svg, .ts, .txt, .xlf,
```
PR Close #45325
2022-03-10 16:48:09 +00:00
< a id = "cli-options" > < / a >
2021-09-13 22:24:00 +00:00
2022-08-28 09:33:56 +00:00
## Command line options
2021-05-26 22:32:29 +00:00
2022-10-03 21:44:40 +00:00
Most of the time you interact with the Angular Compiler indirectly using Angular CLI. When debugging certain issues, you might find it useful to invoke the Angular Compiler directly.
2021-05-26 22:32:29 +00:00
You can use the `ngc` command provided by the `@angular/compiler-cli` npm package to call the compiler from the command line.
The `ngc` command is just a wrapper around TypeScript's `tsc` compiler command and is primarily configured via the `tsconfig.json` configuration options documented in [the previous sections ](#angular-compiler-options ).
2022-10-03 21:44:40 +00:00
Besides the configuration file, you can also use [`tsc` command line options ](https://www.typescriptlang.org/docs/handbook/compiler-options.html ) to configure `ngc` .
2021-09-13 22:24:00 +00:00
<!-- links -->
2022-09-29 10:18:15 +00:00
[AioGuideI18nCommonPrepareMarkTextInComponentTemplate]: guide/i18n-common-prepare#mark-text-in-component-template "Mark text in component template - Prepare component for translation | Angular"
2021-09-13 22:24:00 +00:00
<!-- end links -->
2023-10-25 16:38:03 +00:00
@reviewed 2023-10-24
