Solution to .eslintrc.js code specification in Vue scaffolding

When we use Vue scaffolding to create projects, especially when teams develop projects together, they will be programmed according to a common coding specification. There is a .eslintrc.js format in Vue scaffolding, but in programming we usually use shift+alt+f to code. Formatting, but because the formatted code is not coordinated with the .eslintrc specification in Vue, especially ""; and the control of spaces. The

above is the result of using different code specification format codes.

Solution: Eslink

Configure Eslink
which is a plug-in in VScode

1.Install the plug-in

2. Configure the following code;

  // 配置 eslint  
    "editor.codeActionsOnSave": {
        "source.fixAll.eslint": true
    },
    "eslint.format.enable": true,
    //autoFix默认开启，只需输入字符串数组即可 
    "eslint.validate": [
        "javascript",
        "vue",
        "html"
    ],
    "[vue]": {
        "editor.defaultFormatter": "dbaeumer.vscode-eslint"
    }

At this time, when writing a vue file, it will automatically be detected according to the eslint standard syntax, and errors will be marked. When the code is saved, the code will automatically be repaired according to the eslint syntax requirements.