Traitify's Javascript Style Guide

Note: This guide just outlines the differences from Airbnb's Guide

Rules

arrow-parens

"arrow-parens": ["error", "always"]

Consistency
babel/object-curly-spacing

"babel/object-curly-spacing": "error"

Replace non-babel version
class-methods-use-this

"class-methods-use-this": "off"

Allows methods to be overridden
comma-dangle

"comma-dangle": ["error", "never"]

Unnecessary
consistent-return

"consistent-return": "off"

Makes it hard to return early for conditionals
func-names

"func-names": "off"

Unnecessary and unused with arrow functions

jsx-a11y/label-has-for

Deprecated

"jsx-a11y/label-has-for": ["error", {
  components: [],
  required: {
    some: ["nesting", "id"],
  },
  allowChildren: false,
}]

Unnecessary to have nesting for both

keyword-spacing

"keyword-spacing": ["error", {
  before: false,
  after: false,
  overrides: {
    as: {before: true, after: true},
    case: {before: true, after: true},
    catch: {before: true},
    const: {before: true, after: true},
    default: {before: true, after: true},
    else: {before: true, after: true},
    export: {before: true, after: true},
    from: {before: true, after: true},
    import: {before: true, after: true},
    let: {before: true, after: true},
    return: {before: true, after: true},
    this: {before: true, after: true},
    try: {before: true, after: true}
  }
}]

Whitespace - Preference

lines-between-class-members

"lines-between-class-members": ["error", "never"]

Whitespace - Preference
no-else-return

"no-else-return": "off"

Allows more functional styles
no-multiple-empty-lines

"no-multiple-empty-lines": ["error", {max: 1, maxBOF: 0, maxEOF: 0}]

Little stricter
no-underscore-dangle

"no-underscore-dangle": "off"

Doesn't allow const key = _key.toLowerCase()
no-unused-expressions

"no-unused-expressions": ["error", {allowShortCircuit: true, allowTernary: true}]

Short circuits and ternaries are efficient
object-curly-newline

"object-curly-newline": ["error", {multiline: true, consistent: true}]

Too strict
object-curly-spacing

"object-curly-spacing": "off"

Incompatible with babel/object-curly-spacing

prefer-destructuring

"prefer-destructuring": ["error", {
  VariableDeclarator: {
    array: false,
    object: true,
  },
  AssignmentExpression: {
    array: false,
    object: false,
  },
}, {
  enforceForRenamedProperties: false,
}]

Assignment expression looks funky with parens

quote-props

"quote-props": ["error", "consistent-as-needed", {keywords: false}]

Consistency
quotes

"quotes": ["error", "double", {allowTemplateLiterals: true}]

Double quotes are life
react/destructuring-assignment

"react/destructuring-assignment": "off"

Overactive and solved by prefer-destructuring
react/jsx-boolean-value

"react/jsx-boolean-value": ["error", "always"]

Prefer explicit
react/jsx-filename-extension

"react/jsx-filename-extension": "off"

Unnecessary
react/jsx-one-expression-per-line

"react/jsx-one-expression-per-line": "off"

Creates unnecessary white space issues
react/no-did-update-set-state

"react/no-did-update-set-state": "off"

Makes hacks needed for prop change triggers
react/prefer-stateless-function

"react/prefer-stateless-function": "off"

Prefer React
react/react-in-jsx-scope

"react/react-in-jsx-scope": "off"

Global React
space-before-function-paren

"space-before-function-paren": ["error", "never"]

Whitespace - Preference

TODO

These rules are turned off temporarily

react/no-unused-state

"react/no-unused-state": "off"

Remove when rule is fixed for setState function
react/sort-comp

"react/sort-comp": "off"

Remove when airbnb includes componentDidCatch