Javascript 如何从命令行lint Angular*.html文件？

我想通过命令行删除html角度模板文件，类似于：

ng lint

我想验证Angular html模板，检查它们是否有效，变量是否正确，这样我就可以在Travis或AWS Codebuild这样的CI管道中运行它

Visual studio代码运行Angular语言服务，可以执行以下操作：

我想要的是捕获这些错误，这样我就不会让无效的角度html模板进入发行版

---

如何实现这一点？

您在这里看到的实际上是一个Typescript错误，而不是lint错误

有一个选项允许您在激活AOT时在生成期间捕获此类错误：

此选项告诉编译器启用模板编译器的绑定表达式验证阶段，模板编译器使用TypeScript验证绑定表达式

默认情况下，此选项为false

注意：建议将其设置为true，因为此选项在将来将默认为true

这实际上会大大降低构建速度，因此，如果您只想在CI管道中使用它，您可以做什么：

在tsconfig.app.json旁边创建一个新的tsconfig.strict.json，如下所示：

{
  "extends": "./tsconfig.app.json",
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

"strictProd": {
   "tsConfig": "src/tsconfig.app.strict.json",
   "aot": true
   [...your other prod settings here],
}

在angular.json中，在projects>YourProject>architect>build>configurations下添加一个新的配置“strictProd”，如下所示：

{
  "extends": "./tsconfig.app.json",
  "angularCompilerOptions": {
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true
  }
}

"strictProd": {
   "tsConfig": "src/tsconfig.app.strict.json",
   "aot": true
   [...your other prod settings here],
}

---

使用

ngbuild-cstrictprod运行它

我找到的最好的东西是html提示节点包。您可以在此处阅读：

以下是使用Angular的.htmlhintrc的设置

{ “标记名小写”：true， “attr lowercase”：false， “属性值双引号”：true， “属性值不为空”：false， “attr无重复”：正确， “doctype first”：false， “标记对”：正确， “标记自关闭”：正确， “空标签未自动关闭”：true， “spec char escape”：false， “id唯一”：false， “src不为空”：真， “标题要求”：正确， “alt require”：true， “doctype-html5”：正确， “id类值”：“true”， “样式禁用”：正确， “内联样式已禁用”：true， “内联脚本已禁用”：true， “空间选项卡混合禁用”：“真”， “id类广告已禁用”：真， “href abs或rel”：false， “attr不安全字符”：正确， “头脚本已禁用”：true

---

}

Related：如果运行AOT命令，它将告诉您html本身中使用的所有未使用或错误的变量