Add the localize package

To take advantage of the localization features of Angular, use the Angular CLI to add the @angular/localize package to your project.

To add the @angular/localize package, use the following command to update the package.json and TypeScript configuration files in your project.

      ng add @angular/localize
ng extract-i18n
ng extract-i18n --output-path src/locale
ng extract-i18n --format=xlf
ng extract-i18n --format=xlf2
ng extract-i18n --format=xmb
ng extract-i18n --format=json
ng extract-i18n --format=arb
ng extract-i18n --out-file source.xlf
ng build --localize
ng serve --configuration=fr
ng build --configuration=production,fr

It adds types: ["@angular/localize"] in the TypeScript configuration files as well as the reference to the type definition of @angular/localize at the top of the main.ts file.

HELPFUL: For more information about package.json and tsconfig.json files, see Workspace npm dependencies and TypeScript Configuration.

If @angular/localize is not installed and you try to build a localized version of your project (for example, while using the i18n attributes in templates), the Angular CLI will generate an error, which would contain the steps that you can take to enable i18n for your project.

Options

OPTION	DESCRIPTION	VALUE TYPE	DEFAULT VALUE
`--project`	The name of the project.	`string`
`--use-at-runtime`	If set, then `$localize` can be used at runtime. Also `@angular/localize` gets included in the `dependencies` section of `package.json`, rather than `devDependencies`, which is the default.	`boolean`	`false`

For more available options, see ng add in Angular CLI.