vscode-eslint的踩坑实践–typescript无法格式化

时间:2021-1-8 作者:admin

引言

最近开发的前端项目随着开发的人员越来越多,代码规范已经是一个很难避免的问题了,虽然百度有fecs这个规则检查,但是不论是icode或者是项目本地都没有配置或检查,完全靠自觉,这是件非常扯淡的事。

icode负责人表示暂时没法支持这个,所以看来只能在本地想想办法了。

fecs中的jformater因为不支持自定义格式化调用规则,让fecs使用起来很蛋疼,所以还是选择了主流开源的eslint。

第一步现在本地配置好相关东东,下一步如果有机会的话,会在preCommit时做eslint检查,但是暂时没有项目的控制权,所以看起来也很难实现,不过应该会写写改造方案吧。

eslint

eslint这个库本来是为了实现插件化可扩展而生的,实在不明白为什么fecs还要自己封一次。。。

可以全局安装或者本地项目中安装,编辑器通常会选择本地库优先,本地.eslintrc.js,优先这点很赞。

前几天看到了腾讯alloyteam发了规则包,对每条规则都写了注释,所以就顺手拿来主义了。

github.com/AlloyTeam/e…

规则都写明白了,支持es、ts、vue、react、tsreact几种规则。

小坑

js文件可以直接通过格式化快捷键进行自动修复,ts就是不可以 😇.

搜了下vscode-eslint这个库的issues,一开始我以为是global和local安装eslint的问题,也怀疑过是不是alloyTeam的规则extends有问题,但是各种排查,各种最小化,发现是文件格式 😂。

目前大部分的规则库给出的配置规则如下:

{
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "html",
        "vue",
        "typescript",
        "typescriptreact"
    ]
}

需要注意的是,这里面只有javascript是默认支持自动修复的,其他的并不支持,所以要改成:

{
    "eslint.validate": [
        "javascript",
        "javascriptreact",
        "html",
        "vue",
        {
            "language": "typescript",
            "autoFix": true
        },
        "typescriptreact"
    ]
}

结论

每一个看似很简单的问题,排查的时候都很难呀 😤

声明:本文内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎进行举报,并提供相关证据,工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。