{"id":25992,"library":"ngx-translate-messageformat-compiler","title":"ngx-translate-messageformat-compiler","description":"Compiler for ngx-translate that uses messageformat.js to compile translations using ICU syntax for handling pluralization and gender. Current stable version is 7.2.0, released under an MIT license with monthly releases. Key differentiators: supports Angular 13+, ngx-translate 14-17, and messageformat 3; provides MESSAGE_FORMAT_CONFIG token for custom formatters and options; enables ICU pluralization and gender selection in ngx-translate projects. Requires unsafe-eval CSP for runtime compilation.","status":"active","version":"7.2.0","language":"javascript","source_language":"en","source_url":"https://github.com/lephyrus/ngx-translate-messageformat-compiler","tags":["javascript","angular","angular 2","declension","i18n","icu","gender","messageformat","ngx-translate","typescript"],"install":[{"cmd":"npm install ngx-translate-messageformat-compiler","lang":"bash","label":"npm"},{"cmd":"yarn add ngx-translate-messageformat-compiler","lang":"bash","label":"yarn"},{"cmd":"pnpm add ngx-translate-messageformat-compiler","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"Peer dependency for Angular framework features","package":"@angular/core","optional":false},{"reason":"Peer dependency for messageformat compilation","package":"@messageformat/core","optional":false},{"reason":"Peer dependency for ngx-translate integration","package":"@ngx-translate/core","optional":false}],"imports":[{"note":"ESM-only module; use named import","wrong":"const { TranslateMessageFormatCompiler } = require('ngx-translate-messageformat-compiler')","symbol":"TranslateMessageFormatCompiler","correct":"import { TranslateMessageFormatCompiler } from 'ngx-translate-messageformat-compiler'"},{"note":"Injection token from this library, not from ngx-translate","wrong":"import { MESSAGE_FORMAT_CONFIG } from '@ngx-translate/core'","symbol":"MESSAGE_FORMAT_CONFIG","correct":"import { MESSAGE_FORMAT_CONFIG } from 'ngx-translate-messageformat-compiler'"},{"note":"Default export not available; must use named import","wrong":"import TranslateMessageFormatCompiler from 'ngx-translate-messageformat-compiler'","symbol":"TranslateMessageFormatCompiler","correct":"import { TranslateMessageFormatCompiler } from 'ngx-translate-messageformat-compiler'"}],"quickstart":{"code":"import { bootstrapApplication } from '@angular/platform-browser';\nimport { provideTranslateCompiler, provideTranslateService } from '@ngx-translate/core';\nimport { TranslateMessageFormatCompiler, MESSAGE_FORMAT_CONFIG } from 'ngx-translate-messageformat-compiler';\nimport { MyAppComponent } from './my-app.component';\n\nbootstrapApplication(MyAppComponent, {\n  providers: [\n    provideTranslateService({\n      compiler: provideTranslateCompiler(TranslateMessageFormatCompiler),\n    }),\n    {\n      provide: MESSAGE_FORMAT_CONFIG,\n      useValue: {\n        throwOnError: true,\n        formatters: { upcase: (v) => v.toUpperCase() },\n      },\n    },\n  ],\n});","lang":"typescript","description":"Setup ngx-translate-messageformat-compiler in Angular standalone bootstrap with custom config"},"warnings":[{"fix":"Add 'unsafe-eval' to script-src Content-Security-Policy header","message":"ICU runtime compilation requires unsafe-eval CSP directive","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Update peer dependencies to match required versions","message":"Version 7 requires @ngx-translate/core ^14.0.0 || ^15.0.0 || ^16.0.0 || ^17.0.0 and @messageformat/core ^3.2.0","severity":"breaking","affected_versions":"7.0.0 - 7.2.0"},{"fix":"Upgrade to v7 and use MESSAGE_FORMAT_CONFIG token","message":"Older versions (pre-7) used different config object structure","severity":"deprecated","affected_versions":"<7.0.0"},{"fix":"Use MESSAGE_FORMAT_CONFIG keys as documented, not raw MessageFormat option names","message":"MESSAGE_FORMAT_CONFIG keys differ from MessageFormat options (e.g., biDiSupport not biDiSupport)","severity":"gotcha","affected_versions":">=1.0.0"},{"fix":"Use ICU syntax like {{ count, plural, =1 {one} other {# other} }} instead of ngx-translate native interpolation","message":"Placeholder syntax differs from ngx-translate default (ICU vs {{ }}); ngx-translate translate pipe/directive works but requires ICU syntax in translation values","severity":"gotcha","affected_versions":">=1.0.0"}],"env_vars":null,"last_verified":"2026-05-01T00:00:00.000Z","next_check":"2026-07-30T00:00:00.000Z","problems":[{"fix":"Switch to ESM import syntax: import { TranslateMessageFormatCompiler } from 'ngx-translate-messageformat-compiler'","cause":"Node require() used with ESM-only package","error":"ERROR Error: Uncaught (in promise): TypeError: messageformat_compiler_1.TranslateMessageFormatCompiler is not a constructor"},{"fix":"Add { provide: MESSAGE_FORMAT_CONFIG, useValue: {...} } to providers array","cause":"Missing provider for MESSAGE_FORMAT_CONFIG injection token","error":"NullInjectorError: No provider for MESSAGE_FORMAT_CONFIG"}],"ecosystem":"npm","meta_description":null,"install_score":null,"install_tag":null,"quickstart_score":null,"quickstart_tag":null}