首先安装插件

image.png

vscode 文件 —》首选项 -》 设置
vscode支持两种设置，一种是设置用户级，一种是设置工作区推荐使用工作区的，因为此设置会在项目根目录中写入一个.vscode的文件夹里面有一个settings.json,下面那个文件就是此文件的内容，需要注意的是
“eslint.validate”: [
“javascript”,
“javascriptreact”,
{“language”: “typescript”, “autoFix”: true }, // 如果在typescript中一定要写这个否则没有效果
{“language”: “typescriptreact”, “autoFix”: true } // 如果在typescript中一定要写这个否则没有效果
],

新版本 vscode eslint 配置，补上

  1. {
  2. "eslint.enable": true,
  3. "eslint.alwaysShowStatus": true,
  4. "eslint.codeAction.showDocumentation": {
  5.   "enable": true
  6. },
  7. "editor.codeActionsOnSave": {
  8.   "source.fixAll.eslint": true
  9. },
  10. "eslint.format.enable": true,
  11. "eslint.debug": true,
  12. "eslint.validate": [
  13.     "javascript",
  14.   "javascriptreact",
  15. ]
  16. }
  1. {
  2.   "editor.tabSize": 2,
  3.   "eslint.enable": true,
  4.   "eslint.autoFixOnSave": true,
  5.   "eslint.validate": [
  6.     "javascript",
  7.     "javascriptreact",
  8.     {"language": "typescript", "autoFix": true },
  9.     {"language": "typescriptreact", "autoFix": true }
  10.   ],
  11.   "eslint.alwaysShowStatus": true,
  12.   "eslint.codeAction.showDocumentation": {
  13.     "enable": true
  14.   },
  16.   "eslint.workingDirectories": [
  17.     "./assets"
  18.   ],
  20.   "eslint.options": { "configFile": "/Users/lijunyang/project/prometheus/.eslintrc.json" },
  21.   "eslint.nodePath": "/Users/lijunyang/project/prometheus/node_modules",
  23.   "eslint.lintTask.options": "-c /Users/lijunyang/project/prometheus/.eslintrc.json --ignore-path /Users/lijunyang/project/prometheus/.eslintignore .",
  24.   "eslint.lintTask.enable": true,
  26.   "editor.formatOnPaste": false,
  27.   "emmet.includeLanguages": {
  28.     "javascript": "javascriptreact"
  29.   },
  30.   "emmet.triggerExpansionOnTab": true,
  31.   "editor.snippetSuggestions": "top",
  32.   "files.autoGuessEncoding": false,
  34.   "javascript.implicitProjectConfig.experimentalDecorators": true,
  36. }
  1. "scripts": {
  2.     "eslint": "eslint --ext .ts --ext .tsx --ext .js --ext .jsx --ignore-path .gitignore .",
  3.     "check-filename": "node ./bin/check-filename.js",
  4.     "auto-fix": "eslint --fix --ext .ts --ext .tsx --ext .js --ext .jsx --ignore-path .gitignore ."
  5. },

注意事项

vscode可以安装Error Lens和Error Gutters插件辅助错误提示。
有时候错误提示没有出现，可能是因为某些配置不符合条件导致的。
可以利用辅助工具栏打开错误提示开关
image.png