create-react-app

add_deps.sh

yarn create react-app ...
yarn add -D eslint-config-prettier eslint-plugin-prettier husky lint-staged prettier pretty-quick

launch.json

{
  // Use IntelliSense to learn about possible attributes.
  // Hover to view descriptions of existing attributes.
  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
  "version": "0.2.0",
  "configurations": [
    {
      "type": "chrome",
      "request": "launch",
      "name": "Launch Chrome against localhost",
      "url": "http://localhost:3000",
      "webRoot": "${workspaceFolder}/src",
      "sourceMapPathOverrides": {
        "webpack:///src/*": "${webRoot}/*"
      }
    }
  ]
}

package.json

"eslintConfig": {
    "extends": [
      "react-app",
      "plugin:prettier/recommended"
    ],
    "rules": {
      "jsx-quotes": [
        "error",
        "prefer-double"
      ]
    }
  },
  "prettier": {
    "trailingComma": "es5",
    "semi": false,
    "singleQuote": true,
    "jsxSingleQuote": false
  },
  "lint-staged": {
    "src/**/*.{js,jsx,ts,tsx,json,css,scss,md}": [
      "pretty-quick --staged",
      "git add"
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  }

settings.json

{
  "editor.formatOnSave": true,
  "html.format.endWithNewline": true
}