In-depth Guides
Internationalization

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/localizeng extract-i18nng extract-i18n --output-path src/localeng extract-i18n --format=xlfng extract-i18n --format=xlf2ng extract-i18n --format=xmbng extract-i18n --format=jsonng extract-i18n --format=arbng extract-i18n --out-file source.xlfng build --localizeng serve --configuration=frng 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.

What's next