vue-cli eslint 沒有捕獲錯誤

Question

我正在嘗試為我的新 vue cli 項目設置我的 eslint。 它不起作用。 它通過了，但我沒有發現我有意添加的錯誤。 任何想法我做錯了什么？

vue.config.js

  devServer: {
    overlay: {
      warnings: true,
      errors: true,
    },
  },
  lintOnSave: true,

.eslintrc.js

module.exports = {
  root: true,
  env: {
    browser: true,
    node: true,
  },
  parserOptions: {
    parser: "babel-eslint",
  },
  extends: ["plugin:vue/essential", "eslint:recommended", "@vue/prettier"],
  plugins: ["prettier"],
  // add your custom rules here
  rules: {
    semi: "error",
    "no-console": process.env.NODE_ENV === "production" ? "error" : "off",
    "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
  },
};

src/App.vue:

...
methods: {
  test() {
    return true;
  },
},
...

vue-cli-service lint 結果：

> project@0.1.0 lint /project/location/component_library
> vue-cli-service lint

 DONE  No lint errors found!

Answer 1

因為它是 vue-cli 項目，如果您使用 vue-cli-ui，go 到 'Plugins' => 'Add Plugin' 並在 vue-cli 插件頁面上搜索並安裝eslint-plugin-vue 。 它簡化了很多，易於使用，使用正確的選項管理 linting。 在安裝后屏幕上，select eslint-type (prettier, airbnb etc) （或者）您可以將解析器設置為vue-eslint-parser並將解析器選項設置為babel-eslint

或者，如果您不使用 vue-cli 服務，這是使用eslint-plugin-vue的最小配置集，請將其添加到 .eslintrc.js 文件中。

module.exports = { 
  root: true,
  env: {
    browser: true,
    node: true
  },
  extends: [
    'plugin:vue/strongly-recommended',
    'plugin:vue/essential',
    '@vue/prettier', //recommended use @vue/airbnb

  ],
  // add your custom rules here
  rules: {
    //"semi": "error",
    //"no-console": process.env.NODE_ENV === "production" ? "error" : "off",
    //"no-debugger": process.env.NODE_ENV === "production" ? "error" : "off",
    //"no-unused-vars": process.env.NODE_ENV === "production" ? "error" : "off",
    //"vue/no-side-effects-in-computed-properties": "off",
    //"vue/no-async-in-computed-properties": "off",
   
  }, 
  parser: "vue-eslint-parser",
  parserOptions: {
    parser: "babel-eslint",
    "sourceType": "module"
  },
  plugins: [
    //plugins list
  ],
}