VSCODE Workspace

workspacesetting.md

VSCODE WORKSPACE SETTING FOR REACT w/ ESLINT + PRETTIER

ESLINT

{
  "extends": [
    "airbnb",
    "prettier",
    "prettier/react"
  ],
  "parser": "babel-eslint",
  "parserOptions": {
    "ecmaVersion": 8,
    "ecmaFeatures": {
      "experimentalObjectRestSpread": true,
      "impliedStrict": true,
      "classes": true
    }
  },
  "env": {
    "browser": true,
    "node": true,
    "jquery": true,
    "jest/globals": true
  },
  "rules": {
    "no-unused-vars": [
      1,
      {
        "argsIgnorePattern": "props|res|next|^err"
      }
    ],
    "import/no-extraneous-dependencies": [
      "error",
      {
        "devDependencies": [
          "src/**/*.js",
          "buildScripts/**/*.js",
          "src/__tests__/**",
          "**/__tests__/**",
          "*.js"
        ],
        "optionalDependencies": false,
        "peerDependencies": false
      }
    ],
    "react/jsx-filename-extension": [
      1,
      {
        "extensions": [
          ".js",
          ".jsx"
        ]
      }
    ],
    "arrow-body-style": [
      2,
      "as-needed"
    ],
    "no-param-reassign": [
      2,
      {
        "props": false
      }
    ],
    "no-console": [
      "warn"
    ],
    "no-var": [
      "error"
    ],
    "import/prefer-default-export": 0,
    "import": 0,
    "func-names": 0,
    "space-before-function-paren": 0,
    "comma-dangle": 0,
    "max-len": 0,
    "import/extensions": 0,
    "no-underscore-dangle": 0,
    "consistent-return": 0,
    "react/display-name": [
      1,
      {
        "ignoreTranspilerName": false
      }
    ],
    "react/react-in-jsx-scope": 0,
    "react/prefer-stateless-function": [
      1,
      {
        "ignorePureComponents": true
      }
    ],
    "react/forbid-prop-types": 0,
    "react/prop-types": 0,
    "react/no-unescaped-entities": 0,
    "jsx-a11y/accessible-emoji": 0,
    "radix": 0,
    "no-shadow": [
      2,
      {
        "hoist": "all",
        "allow": [
          "resolve",
          "reject",
          "done",
          "next",
          "err",
          "error"
        ]
      }
    ],
    "quotes": [
      2,
      "single",
      {
        "avoidEscape": true,
        "allowTemplateLiterals": true
      }
    ],
    "prettier/prettier": [
      "error",
      {
        "trailingComma": "es5",
        "singleQuote": true,
        "printWidth": 120
      }
    ],
    "jsx-a11y/href-no-has": "off",
    "jsx-a11y/anchor-is-valid": [
      "warn",
      {
        "aspects": [
          "invalidHref"
        ]
      }
    ]
  },
  "plugins": [
    "prettier",
    "jest"
  ]
}

PACKAGE

{
  "devDependencies": {
    "eslint": "^5.11.1",
    "eslint-config-react-app": "^3.0.5",
    "eslint-plugin-flowtype": "3.2.0", <-- optional
    "eslint-plugin-import": "2.14.0", 
    "eslint-plugin-jsx-a11y": "6.1.2",
    "eslint-plugin-react": "^7.12.2",
    "eslint-config-airbnb": "^17.1.0",
    "eslint-config-prettier": "^3.3.0",
    "eslint-plugin-jest": "^22.1.2",
    "eslint-plugin-prettier": "^3.0.1",
    "prettier": "^1.15.3"
  }
}

SETTINGS

{
  "cSpell.words": [
    "add",
    "datepicker",
    "dev",
    "devtools",
    "entrypoints",
    "expensify",
    "extension",
    "flowtype",
    "prettier",
    "redux",
    "scss",
    "server",
    "stylelint"
  ],
  "files.associations": {
    "*.js": "javascript",
    "*.jsx": "javascriptreact",
    ".stylelintrc": "json"
  },
  "files.autoSave": "onFocusChange",
  "eslint.alwaysShowStatus": true,
  "emmet.includeLanguages": {
    "javascript": "javascriptreact"
  },
  "emmet.syntaxProfiles": {
    "javascript": "{jsx|js}"
  },
  "eslint.autoFixOnSave": true,
  "prettier.disableLanguages": [
    "js"
  ]
}