tslint 到 eslint 的迁移记录

原由

项目中同时使用了ts 和 js。也分别配置了tslint 和 eslint（tslint.js .eslintrc）
使用中的主要痛点就是rules两边不一致的问题，不过好在规则修改不太频繁，总算能忍。直到有一天看到了一句话 TSLint will be deprecated some time in 2019，才发现tslint不能再忍了。

迁移带来的好处

• 统一了es 和ts 的配置规则

• 持续跟进最新的tslint技术

  迁移遇到的问题

• 旧版本prettier 对 nullish语法不识别的问题

  • 之前在tslint config里面没有启用prettier，所以一直无感知。究其原因，就是prettier版本过旧（1.15.*）带来的兼容性问题，查询github issues（https://github.com/prettier/prettier/issues/6609），升级到（1.19+）解决
• tslint no-unused-vars 误报的问题
  • https://github.com/typescript-eslint/typescript-eslint/issues/46
  • 调查原因，应该是eslint 和tslint 规则的冲突，启用’@typescript-eslint/no-unused-vars’: ‘error’, 覆盖掉eslint/no-unused-vars，问题解决

• 升级prettier带来的规则变化

  • 很多代码之前明明好好的，一番折腾之后报prettier错误……
  • 还好prettier的修改建议比较中肯，auto fix，解决

    其他修改

• package.json

  • scripts：合并lintts & lintes命令
• webpack eslint-loader
  • 添加ts tsx 文件扩展名
• .eslintrc
  • ‘import/resolver’
    • 添加ts tsx文件扩展名
  • parser 改成 @typescript-eslint/parser
  • plugins 加入一个 @typescript-eslint
• 安装两个新包
  • “@typescript-eslint/eslint-plugin”: “^2.9.0”,
  • “@typescript-eslint/parser”: “^2.9.0”,
• 移除tslint包
  • “tslint”: “^5.11.0”,
  • “tslint-config-prettier”: “^1.15.0”,
  • “tslint-react”: “^3.6.0”,
  • “tslint-react-hooks”: “^2.2.1”,
  • “tslint-sonarts”: “^1.8.0”,

    尝试npm run lint, npm run dev, npm run build, 正常运行

    done!