如何修复 Angular ERROR Unterminated $localize metadata block in ": "

问题

使用 ng buildng serve 构建 Angular 应用程序时,你看到一个或多个以下错误消息:

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

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)
  [...]

解决方案

此错误发生是因为你在 $localize 块中有一个未转义的冒号 :。冒号 :$localize 块中的特殊字符,必须用反斜杠 \ 转义。

例如。

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

必须写成

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

要在 IDE 中查找此类实例,你可以搜索以下正则表达式模式:

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

这将查找包含冒号 : 的所有 $localize 块实例。你可能需要跳过一些误报,但这通常能很快找到问题。

查看 $localize 文档 了解何时需要转义的详细信息


Check out similar posts by category: Angular