每次换电脑后,总是要在新的vscode中配置eslint和prettier-eslnit,每次配置时,总是很头疼,得去找一堆资料,这次就一次性总结一下吧
首先找到配置: 我一般从文件的首选项里去找,
进入后再在用户的设置区中的settings.json中编辑
以上步骤的前提是,vscode中安装了 ESLint和Prettier ESLint插件,且项目中安装了eslint和eslint-plugin-prettier
接下来就在settings.json中配置下 以下是我的配置
{
"editor.fontSize": 16,
"settingsSync.ignoredExtensions": [],
"eslint.alwaysShowStatus": true,
"editor.codeActionsOnSave": {
"source.fixAll": "always",
"source.fixAll.eslint": "explicit"
},
"editor.formatOnSave": true,
"editor.defaultFormatter": "esbenp.prettier-vscode",
"eslint.workingDirectories": [
{
"mode": "auto"
}
],
"eslint.validate": [
"javascript",
"javascriptreact",
"typescript",
"typescriptreact",
"vue",
],
"[html]": {
"editor.defaultFormatter": "vscode.html-language-features"
},
"files.associations": {
"*.cjson": "jsonc",
"*.wxss": "css",
"*.wxs": "javascript"
},
"emmet.includeLanguages": {
"wxml": "html"
},
"minapp-vscode.disableAutoConfig": true,
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[vue]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
"[jsonc]": {
"editor.defaultFormatter": "rvest.vs-code-prettier-eslint"
},
"[typescript]": {
"editor.defaultFormatter": "vscode.typescript-language-features"
},
"git.autofetch": true,
"workbench.colorTheme": "One Dark Pro",
"leetcode.endpoint": "leetcode-cn",
// "leetcode.nodePath": "D:\\program\\node\\node.exe",
"eslint.debug": true,
"eslint.codeActionsOnSave.rules": ["source.formatDocument" , "source.fixAll.eslint"],
"eslint.lintTask.enable": true,
"eslint.nodeEnv": "",
"hediet.vscode-drawio.resizeImages": null,
"npm.keybindingsChangedWarningShown": true,
"diffEditor.ignoreTrimWhitespace": false,
"eslint.format.enable": true,
"eslint.onIgnoredFiles": "warn",
"vs-code-prettier-eslint.prettierLast": true,
"auto-close-tag.disableOnLanguage": []
}
保存配置后重启下vscode,再看项目中有没有生效。 如果没有生效,可以在该项目的vscode控制台的输出中看下是什么原因导致未生效的,根据提升去修改。有可能是vscode版本太低导致,则需升级一下。