Vim+Syntastic适配Ionic自定义HTML标签语法检查问题

嘿，这个问题我之前帮不少开发者处理过——Syntastic默认的HTML语法检查器确实会把Ionic的自定义标签和你自己写的组件标签（比如<user-list>）当成无效元素，抛出烦人的警告。不用屏蔽警告，这几个方法能让语法检查正常适配Ionic项目：

方法1：配置HTMLHint允许自定义元素 #

如果你的Syntastic用的是HTMLHint作为HTML检查工具（这是默认配置之一），只需要在项目根目录创建一个.htmlhintrc配置文件，添加下面的规则：

{
  "custom-element": true,
  "tagname-lowercase": true
}

• custom-element: true：直接告诉HTMLHint允许自定义元素标签，不管是Ionic的还是你自己写的都能被识别。
• tagname-lowercase: true：保持这个规则（Ionic标签都是小写的，你的<user-list>也符合），避免其他不必要的警告。

这个方法的好处是配置文件可以提交到项目仓库，团队成员都能共享，不用每个人单独改Vim配置。

方法2：用Tidy并添加自定义标签白名单 #

如果你的Syntastic用的是Tidy作为检查器，可以给Tidy指定合法的自定义标签：

1. 在Vim配置文件（比如~/.vimrc）里添加：

let g:syntastic_html_tidy_args = '-config ~/.tidyrc'

2. 在你的用户目录下创建~/.tidyrc文件，把Ionic标签和你的自定义标签加进去：

# 块级自定义标签
new-blocklevel-tags: ion-content, ion-header, ion-footer, user-list
# 行内自定义标签
new-inline-tags: ion-icon, ion-badge

把你项目里用到的所有Ionic组件和自定义组件标签都列进去，Tidy就会把它们当成合法的HTML标签处理了。

备选方案：切换到ALE检查引擎 #

如果上面的配置还是觉得繁琐，其实现在很多前端开发者会换成ALE（Asynchronous Lint Engine）代替Syntastic。ALE对现代前端框架的支持更友好，默认就能识别大部分自定义组件标签，而且是异步检查，不会阻塞Vim操作。不过如果你不想换插件，前面两个方法完全能解决问题。

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