1.安装Eslint
1.1 创建项目时安装
选择标准版
选择在保存时执行
下载eslint插件
下载格式化插件
将以下代码放入settings.json中(用于ctrl+s后会自动按eslint的要求格式化)
{
//ESLint插件的配置
"editor.codeActionsOnSave": {
"source.fixAll": true
},
// -------------------------------
"prettier.configPath": "C:\\Users\\emma.prettierrc",
//eslint和prettier和vetur 配置
"eslint.alwaysShowStatus": true,
"prettier.trailingComma": "none",
"prettier.semi": false,
// 每行文字个数超出此限制将会被迫换行
"prettier.printWidth": 300,
// 使用单引号替换双引号
"prettier.singleQuote": true,
"prettier.arrowParens": "avoid",
// 设置.vue文件中,HTML代码的格式化插件
"vetur.format.defaultFormatter.html": "js-beautify-html",
"vetur.ignoreProjectWarning": true,
"vetur.format.defaultFormatterOptions": {
"prettier": {
"trailingComma": "none",
"semi": false,
"singleQuote": true,
"arrowParens": "avoid",
"printWidth": 300
},
"js-beautify-html": {
"wrap_attributes": false
}
},
// -------------------------------
"files.autoSave": "afterDelay",
"prettier.requireConfig": true,
"[html]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"[javascript]": {
"editor.defaultFormatter": "HookyQR.beautify"
},
"editor.formatOnSave": true,
//ESLint插件的配置
"editor.codeActionsOnSave": {
"source.fixAll": true
},
// -------------------------------
}
// -------------------------------
设置缩进为2个空格
将这个文件放到用户目录下
在seting.json中写入(配置这玩意的意义是啥,没看明白,也没试过不配置这个会咋滴,不是重点)
"prettier.configPath": "C:\\Users\\emma.prettierrc",
演示效果:
点击ctrl+s,自动修改完成