Prettier 和 ESLinit 在 swtich case 缩进上不兼容,该如何解决。

发布于 2022-09-12 22:10:04 字数 1351 浏览 22 评论 0

接手一套遗留项目,用了 eslint ,规则如下:

{
'react/display-name': 0,
'react/prop-types': 0,
'camelcase': 0,
'eqeqeq': 0,
'max-len': ['error', 120],
'comma-dangle': ['error', 'always-multiline'],
'space-before-function-paren': ['error', 'never'],
'object-curly-spacing': ['error', 'never'],
'arrow-parens': ['error', 'as-needed'],
indent: ['error', 2],
quotes: ['error', 'single'],
'no-console': 0,
'react/jsx-no-bind': 0,
'react/no-did-update-set-state': 0,
}

项目没有用到 prettier ,相信是依赖 eslint src/js/ --fix 来格式化代码,但是项目代码量非常大且老旧,执行一次命令需要约三分钟,效率过低。由于不希望修改项目原有的 eslint 配置,所以我自己配置了 .prettierrc 给自己用:

{
  "printWidth": 120,
  "tabWidth": 2,
  "singleQuote": true,
  "semi": false,
  "bracketSpacing": false,
  "trailingComma": "es5",
  "jsxSingleQuote": true
}

基本上 Prettier 和 ESLinit 的格式已经非常接近了,就是在 switch 语句的缩进格式上不兼容:

switch (name) {
  case user:
    return true
  default:
    return false

ESLinit 要求 switch 和 case 必须对齐,而 Prettier 会让 case 缩进一个单位。所以问题来了,能否在不修改 ESLinit 配置的情况下,让 Prettier 不缩进 case 关键字呢?

我查阅过 Prettier 文档,似乎没有对 case 有配置,如果有请告诉我,或者有其他解决办法也感谢分享一下。

PS:其实我有想到临时的解决方案,不完美但是能用。给遇到同类问题的朋友一个解决方案,就是用

/* eslint-disable indent */
/* eslint-enable indent */

把 switch 代码块包裹起来,这样此区域内的缩进检查就不生效了,慎用。欢迎讨论其他解决方案。

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

何其悲哀 2022-09-19 22:10:04

我的做法是修改了eslint的缩进

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文