Vueはeslintrc.jsファイルを設定することで、no-trailing-spacesやno-undefなどのコンパイル時のエラーを修正することができます。

エラーメッセージが表示されます。

D:\work\vue\workbench\src\views\login\index.vue
  12:10 warning 'Options' is defined but never used @typescript-eslint/no-unused-vars
  14:1 error '$' is not defined no-undef
  14:16 error Trailing spaces not allowed no-trailing-spaces

✖ 3 problems (2 errors, 1 warning)
  1 error and 0 warnings potentially fixable with the `--fix` option.

下図のように

1、デフォルトのeslintのルール：このようなコードの終わりにセミコロンを追加することはできません、コードは複数の空の行に存在することはできません、タブキーを使用することはできません、2つのスペースで置き換える必要があります、コードは宣言されたが使用されていない変数に存在することはできません、コードはシングルクォートを使用しなければなりません、コードのいくつかの部分は、スペースを持たなければなりませんなどです。一度書き間違えると、コンパイルがおかしくなるので、その後、設定する必要があり、Vueの使用 Vue -cliで作成したディレクトリには、.eslintrc.jsファイルがないので、以下の画像のように手動で作成する必要がある。

2. コード内のコンテンツは次のようになります。

module.exports = {
    root: true,
    parser: 'babel-eslint',
    parserOptions: {
        // Set "script" (default) or "module" if your code is a module in ECMAScript.
        sourceType: 'module'
    },
    env: {
        browser: true,
    },
    // https://github.com/feross/standard/blob/master/RULES.md#javascript-standard-style
    extends: ["vue", "standard", "plugin:vue/recommended"],
    // required to lint *.vue files
    plugins: ["import", "vue"],
    // add your custom rules here
    'rules': {
        'arrow-parens': 0,
        'generator-star-spacing': 0,
        'no-debugger': process.env.NODE_ENV === 'production' ? 2 : 0,
        "no-unused-vars": [
            2, 
            { 
                // Allow declaration of unused variables
                "vars": "local",
                // arguments are not checked
                "args": "none" 
            }
        ],
         // Close statements with forced semicolon endings
        "semi": [0],
        // key value should be preceded by a space or not
        "key-spacing": [0, {
            "singleLine": {
                "beforeColon": false,
                "afterColon": true
            },
            "multiLine": {
                "beforeColon": true,
                "afterColon": true,
                "align": "colon"
            },
            // Empty lines should not exceed a maximum of 100 lines
            "no-multiple-empty-lines": [0, {"max": 100}],
            //Turn off disabling mixed tabs and spaces
            "no-mixed-spaces-and-tabs": [0],
            //The first in the array specifies whether to enable this rule, the second specifies how many spaces
            "indent":[1,2]
        }]
    }
}

3. .eslintrc.js' で宣言されたパーサー 'babel-eslint' を読み込むのに失敗しました。以下のように、この設定ファイルを介してコンパイル時にモジュール 'babel-eslint' を見つけることができません。

4. 次に、npm install eslint babel-eslint -Dを実行して、babel-eslintをインストールする必要があります。

5、実行後、Error: Failed to load plugin 'html' declared in '.eslintrc.js': Cannot find module 'eslint-plugin-html', as shown below.

6. npm install eslint-plugin-html --save-dev を実行するか、以下のように package.json ファイルを修正して依存パッケージに eslint-plugin-html を追加することで解決します。

7、実行npmインストールすることができ、2回目の実行で再びエラーが表示されますパースエラー。Adjacent JSX elements must be wrapped in an enclosing tag. </>? と、以下の画像のような様々なエラーが表示されます。

8. そしてここで、設定ファイルを変更して

    extends: "standard",
    // required to lint *.vue files
    plugins: ["vue"],

に修正します。

    extends: ["vue", "standard", "plugin:vue/recommended"],
    // required to lint *.vue files
    plugins: ["import", "vue"],

以上、この時点ではもうエラーはありません

  12:10 warning 'Options' is defined but never used @typescript-eslint/no-unused-vars
  14:1 error '$' is not defined no-undef
  14:16 error Trailing spaces not allowed no-trailing-spaces

または、package.jsonのenvを以下のように変更します。

"env": {
      "node": true,
      "browser":true,
      "jquery": true
    },

注：これらの最後の設定は、package.jsonのeslintConfigに

{
  "name": "workbench",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service-serve",
    "build": "vue-cli-service build",
    "test:unit": "vue-cli-service test:unit",
    "test:e2e": "vue-cli-service test:e2e",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "register-service-worker": "^1.7.1",
    "vue": "^3.0.0",
    "vue-class-component": "^8.0.0-0",
    "vue-router": "^4.0.0-0",
    "vuex": "^4.0.0-0",
    "jquery": "3.5.1",
    "@types/jquery": "3.3.1",
    "bootstrap": "4.5.2",
    "@types/bootstrap": "4.1.0"
  },
  &q

など、よくある設定ミス

"@typescript-eslint/explicit-function-return-type": "off",//
"@typescript-eslint/interface-name-prefix": "off",//
"@typescript-eslint/no-unused-vars": "off",// Turn off warnings when variables are declared and not used
"@typescript-eslint/no-explicit-any": "off",
"no-alert": 0,// disable alert confirm prompt
"no-array-constructor": 2,//Forbid the use of array constructors
"no-bitwise": 0,//Prohibit the use of bitwise operators
"no-caller": 1,//Disable arguments.caller or arguments.callee
"no-catch-shadow": 2,//Disable catch clause arguments with the same name as an external scope variable
"no-class-assign": 2,//Disable assigning values to classes
"no-cond-assign": 2,//Disallow the use of assignment statements in conditional expressions
"no-console": 2,//Disable the use of consoles
"no-const-assign": 2,//Disallow modification of const declared variables
"no-constant-condition": 2,//Disallow the use of constant expressions in conditions if(true) if(1)
"no-continue": 0,//prohibit the use of continue
"no-control-regex": 2,//Prohibit the use of control characters in regular expressions
"no-debugger": 2,//Debugger is forbidden
"no-delete-var": 2,//Delete operator cannot be used on var declared variables
"no-div-regex": 1,// Cannot use regular expressions that look like division /=foo/
"no-dupe-keys": 2,// Do not allow duplicate keys when creating object literals {a:1,a:1}
"no-dupe-args": 2,//Function arguments cannot be duplicated
"no-duplicate-case": 2,//Switch case tags cannot be duplicated
"no-else-return": 2,//If there is a return inside the if statement, it cannot be followed by an else statement
"no-empty": 2,// the content of the block statement can not be empty
"no-empty-character-class": 2,//the content of [] in the regular expression cannot be empty
"no-empty-label": 2,//Forbid the use of empty labels
"no-eq-null": 2,//Forbid the use of == or ! = operator
"no-eval": 1,//forbid the use of eval
"no-ex-assign": 2,//forbid to assign values to exception parameters in catch statements
"no-extend-native": 2,//Disable extending native objects
"no-extra-bind": 2,//Disable unnecessary function binding
"no-extra-boolean-cast": 2,//Disable unnecessary bool conversions
"no-extra-parens": 2,//Prohibit unnecessary parentheses
"no-extra-semi": 2,//Disable superfluous colons
"no-fallthrough": 1,//Disable switch pass-through
"no-floating-decimal": 2,//Disable omitting the 0 .5 in floating point numbers 3.
"no-func-assign": 2,//Disable duplicate function declarations
"no-implicit-coercion": 1,//Disallow implicit conversions
"no-implied-eval": 2,//Disable implicit eval
"no-inline-comments": 0,//Disable inline comments
"no-inline-declarations": [2, "functions"],//prohibit the use of declarations (variables or functions) in block statements
"no-invalid-regexp": 2,//Disable invalid regular expressions
"no-invalid-this": 2,//Disable invalid this, only for constructors, classes, object literals
"no-irregular-whitespace": 2,//no irregular spaces
"no-iterator": 2,//Prohibit the use of the __iterator__ attribute
"no-label-var": 2,//Label name cannot be the same as the variable name declared by var
"no-labels": 2,//Prohibit label declarations
"no-lone-blocks": 2,//Prohibit unnecessary nested blocks
"no-lonely-if": 2,//Prohibit only if statements within else statements
"no-loop-func": 1,//prohibit the use of functions in loops (if no external variables are referenced without forming closures)
"no-mixed-requires": [0, false],//declaration cannot be mixed with declaration types
"no-mixed-spaces-and-tabs": [2, false],//prohibit mixing tabs and spaces
"linebreak-style": [0, "windows"],//line feed style
"no-multi-spaces": 1,//no extra spaces
"no-multi-str": 2,//Strings can't use \ newlines
"no-multiple-empty-lines": [1, {"max": 2}],//no more than 2 blank lines
"no-native-reassign": 2,//can't override native objects
"no-negated-in-lhs": 2,//The left side of the in operator cannot have !
"no-nested-ternary": 0,//Nested trinomials are forbidden
"no-new": 1,//Prohibit the use of new to construct an instance without assigning a value
"no-new-func": 1,//Disable the use of new Function
"no-new-object": 2,//Disable the use of new Object()
"no-new-require": 2,//prohibit the use of new require
"no-new-wrappers": 2,//prohibit the use of new to create wrapper instances, new String new Boolean new Number
"no-obj-calls": 2,// Cannot call built-in global objects, such as Math() JSON()
"no-octal": 2,//Forbid the use of octal numbers
"no-octal-escape": 2,//Disable the use of octal escape sequences
"no-param-reassign": 2,//Disable reassigning parameters
"no-path-concat": 0,//Node cannot use __dirname or __filename for path concatenation
"no-plusplus": 0,//Forbid the use of ++, --
"no-process-env": 0,//prohibit the use of process.env
"no-process-exit": 0,//prohibit the use of process.exit()
"no-proto": 2,//Prohibit the use of the __proto__ attribute
"no-redeclare": 2,//Prohibit repeated declaration of variables
"no-regex-spaces": 2,//Disallow the use of multiple spaces in regular expression literals /foo bar/
"no-restricted-modules": 0,//If the specified module is disabled, an error will be reported if it is used
"no-return-assign": 1,//return statements cannot have assignment expressions in them
"no-script-url": 0,//forbid the use of javascript:void(0)
"no-self-compare": 2,// Cannot compare itself
"no-sequences": 0,//forbid the use of comma operators
"no-shadow": 2,//Variables in external scopes cannot have the same name as variables or arguments in the scope they are contained in
"no-shadow-restricted-names": 2,// Restricted identifiers specified in strict mode cannot be used as variable names at declaration time
"no-spaced-func": 2,//Function calls must not have spaces between function name and ()
"no-sparse-arrays": 2,//Sparse arrays are forbidden, [1,,2]
"no-sync": 0,//nodejs disables sync methods
"no-ternary": 0,//prohibit trinomial operators
"no-tiling-spaces": 1,//No spaces after the end of a line
"no-this-before-super": 0,//no this or super before calling super()
"no-throw-literal": 2,//Disable throwing literal errors throw "error";
"no-undef": 1,// Cannot have undefined variables
"no-undef-init": 2,//Variables can't be assigned undefined directly when initialized
"no-undefined": 2,// Cannot use undefined
"no-unexpected-multiline": 2,//Avoid multi-line expressions
"no-underscore-dangle": 1,//Identifiers must not start or end with _
"no-unneeded-ternary": 2,//Prohibit unnecessary nesting var isYes = answer === 1 ? true : false;
"no-unreachable": 2,//No unexecutable code
"no-unused-expressions"