1.下载对应的ESlint风格插件,Prettier-Standard-Javascript,Prettier等格式化插件.
2.右键会显示出使用哪个插件进行格式化的选项,后面选择自己喜欢的对应风格格式化
3.在设置里面搜索格式化,对VSCode的格式化选项进行设置,比如自己下载了多个插件格式化,可以设置默认的一个,还有是不是实时保存格式化,粘贴复制的内容是不是自动格式化
4.VSCode 遇到单个html文件调试报Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https,(安装Liver Server插件)直接右键选择这个启动
5.具体代码的风格编写规则 要在settings.json文件里面配置
{
"editor.tabSize": 2, //制表符符号eslint
"git.autofetch": true,
"editor.fontFamily": "'Courier New', Consolas, monospace",
"editor.fontSize": 16,
// 文件注释
"fileheader.customMade": {
"Des": "页面、组件说明",
"Author": "姓名",
"Date": "Do not edit",
"query": "{string} p1 内容ID",
"props": "{string} p1 数据源",
"event": "{string} p1 des"
},
// 函数注释
"fileheader.cursorMode": {
"Des": "函数说明",
"param": " p1 内容ID",
"return": "客户列表"
},
"fileheader.configObj": {
"createHeader": true, // 默认打开
"autoAdd": true // 检测文件没有头部注释,自动添加文件头部注释
},
"files.autoGuessEncoding": true,
// "files.autoSave": "afterDelay", //自动保存
// "editor.lineNumbers": "on", //打开行号
"editor.quickSuggestions": {
//开启自动显示建议
"other": true,
"comments": true,
"strings": true
},
"editor.formatOnSave": true, //保存时自动格式化
// "eslint.autoFixOnSave": true, //保存时自动将代码按ESLint格式进行修复
//autoFixedOnSave 设置已废弃,采用如下新的设置
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"eslint.format.enable": true,
"eslint.validate": [
"javascript",
"vue",
"html"
],
// Use 'prettier-eslint' instead of 'prettier
"prettier.eslintIntegration": true, // 让prettier使用eslint的代码格式进行校验
"prettier.semi": false, //去掉代码结尾的分号
"prettier.singleQuote": true, //让函数(名)和后面的括号之间加个空格
"vetur.format.defaultFormatter.html": "js-beautify-html", //格式化.vue中html
"vetur.format.defaultFormatter.js": "vscode-typescript", //让vue中的js按编辑器自带的ts格式进行格式化
"vetur.format.defaultFormatterOptions": {
"wrap_attributes": "force-expand-multiline",
"js-beautify-html": {
"end_with_newline": false,
"wrap_attributes": "force-aligned"
}
},
"emmet.triggerExpansionOnTab": true,
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
"[vue]": {
"editor.defaultFormatter": "octref.vetur"
},
"git.enableSmartCommit": true,
"liveServer.settings.donotShowInfoMsg": true,
"eslint.options": {},
"editor.detectIndentation": false,
"files.autoSave": "afterDelay",
"typescript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false,
"prettier.trailingComma": "all",
"javascript.format.insertSpaceAfterFunctionKeywordForAnonymousFunctions": false,
"git.confirmSync": false,
"editor.wordWrap": "on",
"eslint.nodeEnv": "",
"eslint.codeAction.showDocumentation": {
"enable": true
},
"diffEditor.ignoreTrimWhitespace": false,
"editor.fontLigatures": null,
"editor.renderControlCharacters": true,
"editor.renderWhitespace": "all",
"files.associations": {
".cjson": "jsonc",
".wxss": "css",
".wxs": "javascript",
".vue": "vue"
// "*.vue": "html"
},
"emmet.includeLanguages": {
"wxml": "html"
},
"minapp-vscode.disableAutoConfig": true,
"[json]": {
"editor.quickSuggestions": {
"strings": true
},
"editor.suggest.insertMode": "replace",
"gitlens.codeLens.scopes": [
"document"
]
},
"jshint.options": {
"asi":true,
"esversion":6
},
"editor.formatOnPaste": true,
"editor.formatOnType": true,
"html.format.indentHandlebars": true,
"AllAutocomplete.languageWhitespace": {
"ruby": "[^\w\-\\u0080-\uFFFF]+",
"javascriptreact": "[^\w\-\\@\u0080-\uFFFF]+",
"php": "[^\w_\\u0080-\uFFFF]+",
"scss": "[^\w\-\\u0080-\uFFFF]+",
"python": "[^\w\-\u0080-\uFFFF]+",
"elm": "[^\w\-\u0080-\uFFFF]+",
"cpp": "[^\w\u0080-\uFFFF]+",
"csv": "[^\w_\u0080-\uFFFF \:]+"
}
}