VSCode Settings + Extensions

Settings

.vscode/settings.json

{
  "eslint.validate": [
    "javascript",
    "javascriptreact",
    "typescript",
    "typescriptreact"
  ],
  "css.validate": false,
  "less.validate": false,
  "scss.validate": false,
  "stylelint.validate": ["css", "scss"],
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true,
    "source.fixAll.stylelint": true
  },
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.formatOnSave": true,
  "[javascript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescript]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true
  },
  "[javascriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode"
  },
  "[typescriptreact]": {
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "editor.formatOnSave": true
  },
  "workbench.iconTheme": "material-icon-theme",
  "workbench.editor.enablePreview": false,
  "workbench.editor.wrapTabs": true,
  "window.zoomLevel": 1,
  // paste image to markdown
  "pasteImage.path": "${currentFileDir}/img",
  "pasteImage.insertPattern": "![](img/${imageFileName})"
}

Recommend Extensions

.vscode/extension.json

{
  "recommendations": [
    "dbaeumer.vscode-eslint",
    "esbenp.prettier-vscode",
    "pkief.material-icon-theme",
    "formulahendry.auto-rename-tag",
    "naumovs.color-highlight",
    "dsznajder.es7-react-js-snippets",
    "donjayamanne.githistory",
    "eamodio.gitlens",
    "vincaslt.highlight-matching-tag",
    "ritwickdey.liveserver",
    "bradlc.vscode-tailwindcss",
    "stylelint.vscode-stylelint",
    "christian-kohler.npm-intellisense",
    "DavidAnson.vscode-markdownlint",
    "mushan.vscode-paste-image"
  ]
}