Wie man Angular ERROR Unterminated $localize metadata block in ": " behebt

Problem

Beim Erstellen Ihrer Angular-Anwendung mit ng build, ng serve sehen Sie eine oder mehrere Instanzen der folgenden Fehlermeldung:

metadata.txt
 [ERROR] Unterminated $localize metadata block in ": ".

oder die folgende Fehlermeldung für ng extract-i18n:

angular_stacktrace.txt
An unhandled exception occurred: /home/user/MyProject/chunk-ZPIUSWGS.js: Unterminated $localize metadata block in ": ".
See "/tmp/ng-Ek7tS1/angular-errors.log" for further details.
/home/user/MyProject/node_modules/rxjs/dist/cjs/internal/util/reportUnhandledError.js:13
      throw err;
      ^

Error: /home/user/MyProject/chunk-ZPIUSWGS.js: Unterminated $localize metadata block in ": ".
  at findEndOfBlock (file:///home/user/MyProject/node_modules/@angular/localize/fesm2022/localize.mjs:547:11)
  at splitBlock (file:///home/user/MyProject/node_modules/@angular/localize/fesm2022/localize.mjs:519:28)
  at parsePlaceholder (file:///home/user/MyProject/node_modules/@angular/localize/fesm2022/localize.mjs:485:42)
  at parseMessage (file:///home/user/MyProject/node_modules/@angular/localize/fesm2022/localize.mjs:389:100)
  at PluginPass.TaggedTemplateExpression (file:///home/user/MyProject/node_modules/@angular/localize/tools/bundles/chunk-URWRI34O.js:69:27)
  at newFn (/home/user/MyProject/node_modules/@babel/traverse/lib/visitors.js:172:14)
  at NodePath._call (/home/user/MyProject/node_modules/@babel/traverse/lib/path/context.js:49:20)
  at NodePath.call (/home/user/MyProject/node_modules/@babel/traverse/lib/path/context.js:39:18)
  at NodePath.visit (/home/user/MyProject/node_modules/@babel/traverse/lib/path/context.js:85:31)
  at TraversalContext.visitQueue (/home/user/MyProject/node_modules/@babel/traverse/lib/context.js:89:16)
  at TraversalContext.visitSingle (/home/user/MyProject/node_modules/@babel/traverse/lib/context.js:65:19)
  at TraversalContext.visit (/home/user/MyProject/node_modules/@babel/traverse/lib/context.js:112:19)
  at traverseNode (/home/user/MyProject/node_modules/@babel/traverse/lib/traverse-node.js:22:17)
  [...]

Lösung

Dieser Fehler tritt auf, weil Sie einen Doppelpunkt : in einem $localize-Block haben, der nicht escaped ist. Der Doppelpunkt : ist ein spezielles Zeichen in $localize-Blöcken und muss mit einem Backslash \ escaped werden.

Zum Beispiel:

localize_example.ts
$localize`Number of entries: ${entries.length}`

muss geschrieben werden als

localize_fixed.ts
$localize`Number of entries\: ${entries.length}`

Um solche Instanzen in Ihrer IDE zu finden, können Sie nach dem folgenden Regex-Muster suchen:

find_localize_colon.regex
\$localize`[^`]*:

Dies findet alle Instanzen von $localize-Blöcken, die einen Doppelpunkt : enthalten. Sie müssen möglicherweise ein paar falsche Positive überspringen, aber dies wird oft das Problem recht schnell finden.

Siehe die $localize-Dokumentation für Details, wann Sie escapen müssen


Check out similar posts by category: Angular