如何在Vue中配置eslint？

Question

我已经开始了一个新的Vue项目，但是所有的配置文件(webpack，...)已经不在那里了。现在所有的东西都隐藏在Vue中，我不知道如何配置它。

我的问题是，eslint会将所有通知和警告视为错误：

error: 'Segment' is defined but never used (no-unused-vars) at src/App.vue:10:8:
   8 | <script>
   9 | import HelloWorld from './components/HelloWorld.vue'
> 10 | import Segment

这应该是一个通知，而不是一个严重错误。

我想要更改这一点，但我的package.json中的默认配置是：

  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "babel-eslint"
    }
  },

是否有和development模式或类似的模式？

Answer 1

目前还没有现成的配置可以将所有规则配置为警告，但您可以通过一个ESLint插件：eslint-plugin-only-warn来完成这一点。安装该模块后，编辑package.json的eslintConfig以包含：

{
  "eslintConfig": {
    "plugins": [
      "only-warn"
    ]
  }
}

或者您可以单独configure those rules为警告，而不是错误：

{
  "eslintConfig": {
    "rules": {
       "no-unused-vars": "warn",
       "no-undef": "warn"
    }
  }
}

Answer 2

例如，您可以禁用not defined和not used警告：

在package.json中：

"eslintConfig": {
    "rules": {
      "no-unused-vars": "off",
      "no-undef": "off"
    },
  },