在StackBlitz中使用Prettier时，如何解决‘无法解析angular解析器’错误？

你遇到的这个错误是因为当前使用的Angular解析器包已被官方废弃，需改用新的官方插件包解决，具体步骤如下：

• 第一步：更新依赖
  在StackBlitz的依赖面板或终端中，移除prettier/parser-angular，安装@prettier/plugin-angular。

• 第二步：修改代码导入与配置
  将原有导入语句：

  import parserAngular from 'prettier/parser-angular';
  

  替换为：

  import pluginAngular from '@prettier/plugin-angular';
  

  同时调整prettier.format的配置参数，把plugins数组内的parserAngular替换为pluginAngular：

  const output = prettier.format(html, {
    plugins: [pluginAngular],
    parser: 'angular',
    singleQuote: true,
    arrowParens: 'always',
    semi: true,
    bracketSameLine: true,
    trailingComma: 'es5',
    printWidth: 140,
  });
  

修改完成后，Prettier就能正确识别Angular解析器，完成HTML代码的格式化。

原因说明 #

Prettier官方已将Angular相关解析器从核心包拆分，不再维护旧的prettier/parser-angular，转而推出独立的@prettier/plugin-angular插件，新版本Prettier需通过该官方插件才能处理Angular模板代码。

内容的提问来源于stack exchange，提问作者Jon