一、安装好插件
二、配置
- .eslintrc.js
module.exports = {
root: true,
env: {
node: true
},
extends: ['plugin:vue/essential', 'eslint:recommended', '@vue/prettier'],
parserOptions: {
parser: 'babel-eslint'
},
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'space-before-function-paren': 0 // <== 这一行代码
}
}
- .prettierrc
{
"singleQuote": true,
"semi": false,
"bracketSpacing": true,
"htmlWhitespaceSensitivity": "ignore",
"arrowParens": "avoid"
}
- 根目录新建.editorconfig
root = true
[*]
charset = utf-8
# 缩进风格为空格
indent_style = space
# 缩进大小为4
indent_size = 4
## 表示以Unix风格的换行符结尾
# end_of_line = lf
# insert_final_newline = true
# # 设为true表示会除去换行行首的任意空白字符。
# trim_trailing_whitespace = true
三、在vscode的设置里找到setting.json
{
"git.path": "E:/Git/bin/git.exe",
"vetur.validation.template": true,
"git.autofetch": true,
"editor.tabSize": 4,
"eslint.autoFixOnSave": true,
// "editor.detectIndentation": false,
"vetur.format.options.tabSize": 4,//四格缩进
// "vetur.format.styleInitialIndent": true,
// "vetur.format.options.useTabs": true,
// "vetur.format.scriptInitialIndent": true,
"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.format.defaultFormatterOptions": {
"js-beautify-html": {
"wrap_attributes": "auto",//属性不换行
"end_with_newline": false
}
// "prettier": {
// // Prettier option here
// "semi": false, //要分号
// "singleQuote": true //要单引号
// }
},
"gitlens.gitExplorer.files.layout": "list",
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},
"update.channel": "none",
"eslint.validate": [
"javascript",
"javascriptreact",
{
"language": "vue",
"autoFix": true
},
"vue"
],
"window.zoomLevel": 0
}