Implementation steps: 1. Install the following plug-ins
1) ESLint: ESLint coding specification
2) Vetur: VUE formatting code
3) Chinese (Simplified) Language Pack for Visual Studio Code
2. Open the configuration file
MacOS uses Command + Sheft + P, Windows use Ctrl + Sheft + P shortcut key –> search for “Configure Language Specific Settings” –> select “Vue” –> open the configuration file –> copy and paste the following code into the configuration file.
{/ / semicolon "prettier. Semi" : false, "prettier. EslintIntegration" : "Prettier.trailingcomma ": "all", "prettier.singleQuote": true," prettier.tabwidth ": 2, // close the built-in format "javascript.format.enable": False, / / function (name) and add a space between the brackets behind the "javascript. The format. InsertSpaceBeforeFunctionParenthesis" : true, / / enable eslint / * this code is the old version, has been abandoned. Enable ": true, "eslint.validate": ["javascript", "javascriptreact", {"language": "vue", "autoFix": }], */ "eslint.format.enable": true, //autoFix is enabled by default, just enter the string array "eslint.validate": [" javascript ", "vue", "HTML"], / / format. The vue HTML "vetur. Format. DefaultFormatter. HTML" : "Js - beautify - HTML / / let the vue of js according to the editor's own ts format to format" vetur. Format. DefaultFormatter. Js ": "vscode-typescript", "vetur.format.defaultFormatterOptions": { "js-beautify-html": {// "wrap_attributes": "force-expand-multiline" // "wrap_attributes": "Force" // "wrap_attributes": "force-aligned",// "wrap_attributes": "auto"}}, "vetur.format. Enable ": True, "eslint.options": {"extensions": [".js", ".vue"]}, /* This version is old and deprecated. Use the following code "eslint.autoFixonSave ": true, */" editor.codeActionsonSave ": {" source.fixall.esLint ": True}, "editor.tabSize": 2, // enable line number prompt "editor.lineNumbers": "On ", // remove the automatic saving of VScode, which is also false by default "editor.formatOnSave": "Editor.detectindentation ": false," editor.quicksuggestions ": {/ / open automatic display advice "other" : true, "comments" : true, "strings" : true}, "extensions. IgnoreRecommendations" : false, "window.zoomLevel": 1, "files.autoGuessEncoding": false, "workbench.sideBar.location": "left" }Copy the code
The reference connection 1:cloud.tencent.com/developer/a…
The reference connection 2:www.cnblogs.com/vs1435/p/11…