Angular类名称中的自定义后缀

Question

是否可以将Angular 7（带有CLI 7.x）项目配置为使用默认名称以外的类名后缀？

更具体地说，对于代表对话框的类，我想最后使用Dialog，而不要使用DialogComponent，因为它不必要地长。对于代表网页的类，我要使用Page，而不是PageComponent。

示例：

• 使用LoginDialog代替LoginDialogComponent
• 使用MainPage代替MainPageComponent

---

由于Angular中预先设置了tslint规则，因此无法进行简单的重命名。

Answer 1

在项目的根目录中打开tslint.json，然后更新component-class-suffix属性：

{
  ...
  "component-class-suffix": [true, "Component", "View"]
  ...
}

请注意，如果您希望默认后缀仍然有效，则组件应保留在该位置。

Answer 2

在 .eslintrc.js 中 - 我正在使用 IONIC，并且许多组件都是使用 Page 后缀创建的，以将页面与页面中使用的“组件”区分开来。以下添加 Page 作为已知后缀。

'@angular-eslint/component-class-suffix': [
      'warn',
      {
        suffixes: ['Component', 'Page'],
      },
    ],

Answer 3

您可以编辑tslint.json，并使用以下规则：

"component-class-suffix": false

这将防止任何棉绒错误