ESLint

.eslintrc

{
    /**
     * ECMA 요구사항
     */
    "ecmaFeatures": {
        "jsx": true,
        "modules": true,
        "experimentalObjectRestSpread": true
    },

    /**
     * 환경설정
     */
    "env": {
        "es6": true,
        "node": true,
        "browser": true
    },

    /**
     * 트렌스파일 파서
     */
    "parser": "babel-eslint",

    /**
     * 플러그인
     */
    "plugins": [
        "react"
    ],

    "globals": {
        "$": true
    },

    /**
     * 규칙
     */
    "rules": {
        /**
         * JS-Standard Rule
         */
        "accessor-pairs": 2,
        "block-spacing": [2, "always"],
        "comma-dangle": [2, "never"],
        "comma-spacing": [2, { "before": false, "after": true }],
        "constructor-super": 2,
        "curly": [2, "multi-line"],
        "dot-location": [2, "property"],
        "eol-last": 2,
        "generator-star-spacing": [2, { "before": true, "after": true }],
        "handle-callback-err": [2, "^(err|error)$" ],
        "key-spacing": [2, { "beforeColon": false, "afterColon": true }],
        "new-cap": [2, { "newIsCap": true, "capIsNew": false }],
        "new-parens": 2,
        "no-caller": 2,
        "no-class-assign": 2,
        "no-cond-assign": 2,
        "no-control-regex": 2,
        "no-debugger": 2,
        "no-delete-var": 2,
        "no-dupe-args": 2,
        "no-dupe-class-members": 2,
        "no-dupe-keys": 2,
        "no-duplicate-case": 2,
        "no-empty-character-class": 2,
        "no-empty-label": 2,
        "no-eval": 2,
        "no-ex-assign": 2,
        "no-extend-native": 2,
        "no-extra-bind": 2,
        "no-extra-boolean-cast": 2,
        "no-extra-parens": [2, "functions"],
        "no-fallthrough": 2,
        "no-floating-decimal": 2,
        "no-func-assign": 2,
        "no-implied-eval": 2,
        "no-inner-declarations": [2, "functions"],
        "no-invalid-regexp": 2,
        "no-irregular-whitespace": 2,
        "no-label-var": 2,
        "no-labels": 2,
        "no-lone-blocks": 2,
        "no-mixed-spaces-and-tabs": 2,
        "no-multi-spaces": 2,
        "no-multi-str": 2,
        "no-multiple-empty-lines": [2, { "max": 1 }],
        "no-native-reassign": 2,
        "no-negated-in-lhs": 2,
        "no-new": 2,
        "no-new-func": 2,
        "no-new-require": 2,
        "no-new-wrappers": 2,
        "no-obj-calls": 2,
        "no-octal": 2,
        "no-octal-escape": 2,
        "no-proto": 2,
        "no-redeclare": 2,
        "no-regex-spaces": 2,
        "no-return-assign": 2,
        "no-self-compare": 2,
        "no-sequences": 2,
        "no-shadow-restricted-names": 2,
        "no-spaced-func": 2,
        "no-sparse-arrays": 2,
        "no-this-before-super": 2,
        "no-throw-literal": 2,
        "no-trailing-spaces": 2,
        "no-undef": 2,
        "no-undef-init": 2,
        "no-unexpected-multiline": 2,
        "no-unneeded-ternary": [2, { "defaultAssignment": false }],
        "no-unreachable": 2,
        "no-unused-vars": [2, { "vars": "all", "args": "none" }],
        "no-useless-call": 2,
        "no-with": 2,
        "operator-linebreak": [2, "after", { "overrides": { "?": "before", ":": "before", "&&": "before", "||": "before" } }],
        "semi-spacing": [2, { "before": false, "after": true }],
        "space-before-function-paren": [2, "never"], // always
        "space-return-throw-case": 2,
        "space-unary-ops": [2, { "words": true, "nonwords": false }],
        "spaced-comment": [2, "always", { "markers": ["global", "globals", "eslint", "eslint-disable", "*package", "!", ","] }],
        "use-isnan": 2,
        "valid-typeof": 2,
        "wrap-iife": [2, "any"],
        "yoda": [2, "never"],
        //"standard/object-curly-even-spacing": [2, "either"],
        //"standard/array-bracket-even-spacing": [2, "either"],
        //"standard/computed-property-even-spacing": [2, "even"],

        /**
         * Airbnb ES6 Rule
         */
        // 대괄호`[]` 안에 공백을 추가하지 않습니다.
        "array-bracket-spacing": [2, "never"],
        // 함수의 본체가 하나의 표현식으로 구성되어있는 경우 암묵적 `return`을 사용
        "arrow-body-style": [2, "as-needed"],
        // 애로우 함수(Arrow Functions)에 사용되는 공백
        "arrow-spacing": [2, { "before": true, "after": true }],
        // 함수의 본체가 하나의 표현식으로 구성되어있는 경우 중괄호`{}`를 생략
        // 함수의 인수가 한 개인 경우 괄호()를 생략할 수 있습니다.
        "arrow-parens": [2, "as-needed"],
        // `else`는 `if`블록의 끝 중괄호`{}`와 같은 행에 두세요.
        "brace-style": [2, "1tbs", { "allowSingleLine": true }],
        // 객체, 함수 인스턴스에는 camelCase(소문자로 시작)를 사용하세요.
        "camelcase": 2,
        // object 마지막에 콤마로 끝내도 됨(git diff가 깨끗해짐)
        // "comma-dangle": [2, "always"], // 이거는 안씀...
        // 쉼표로 시작하는 것은 제발 그만하세요.
        "comma-style": [2, "last"],
        // 속성에 접근하려면 점`.`을 사용하세요.
        "dot-notation": [2, { "allowKeywords": true }], // Promise에서 키워드를 쓰고 있음 ㅡ.ㅡ;
        // `==`와 `!=` 보다는 `===`와 `!==`를 사용하세요.
        "eqeqeq": [2, "allow-null"],
        // 탭에는 공백 2개를 설정하세요.
        "indent": [2, 2, { "SwitchCase": 1 }],
        // 한 줄에 100문자(공백 포함)가 넘는 코드는 피하세요.
        "max-len": [2, 100, 4, { "ignoreUrls": true }], // "ignoreComments": true,
        // 배열을 만들 때 리터럴 구문을 사용하세요.
        "no-array-constructor": 2,
        // `const`는 참조를 다시 할당할 수 없음
        "no-const-assign": 2,
        // 이터레이터(Iterators)를 사용하지 않습니다.
        // 대신 `map()`과 `reduce()`같은 고급함수(higher-order functions)를 사용
        "no-iterator": 2,
        // 객체를 만들 때에는 리터럴 구문을 사용합니다.
        "no-new-object": 2,
        // 절대로 매개변수를 다시 지정하거나 조작하지 않습니다.
        "no-param-reassign": 2,
        // ES6에서는 var를 사용하지 않습니다.
        "no-var": 1,
        // 메소드와 속성에 단축 구문(Object Shorthand)을 사용하세요.
        "object-shorthand": 2,
        // 중괄호`{}` 안에 공백을 추가합니다.
        // "object-curly-spacing": [2, "always"], // 이건 마음에 안들어...
        // 하나의 변수 선언에 대해 하나의 `const`를 사용하세요.
        "one-var": [2, { "initialized": "never" }],
        // 블록에 빈 줄을 끼워넣지 않습니다.
        "padded-blocks": [2, "never"],
        // 익명 함수와 같은 표현식은 애로우 함수(Arrow Functions)를 사용하세요.
        "prefer-arrow-callback": 2,
        // 모든 참조에는 const를 사용
        "prefer-const": 1,
        // 문자열 연결이 아닌 템플릿 문자열(Template Strings)을 사용
        "prefer-template": 2,
        // 항상 형변환을 위한 기수(radix)를 인수로 전달합니다.
        "radix": 2,
        // 제어 구문(`if`, `while` 등)의 괄호`()` 앞에 공백을 넣어주세요.
        "space-after-keywords": [2, "always"],
        // 중괄호`{}` 앞에 공백을 넣어주세요.
        "space-before-blocks": [2, "always"],
        // 제어 구문(`let`, `const`, `else` 등)이 연속되는 경우 앞에 공백을 사용하세요.
        "space-before-keywords": [2, "always"],
        // 연산자 사이에는 공백이 있습니다.
        "space-infix-ops": 2,
        // 괄호`()` 안에 공백을 추가하지 않습니다.
        "space-in-parens": [2, "never"],
        // 세미콜론`;`은 무조건 사용합니다.
        "semi": [2, "always"], // JS-Standard는 never 미친거 아님?
        // 문자열에는 작은 따옴표`'`를 사용하세요.
        "quotes": [2, "single", "avoid-escape"],
        // 속성 이름에 작은 따옴표를 사용하는 경우는 오직 잘못된 식별자(Invalid Identifiers)일 때
        "quote-props": [2, "as-needed"],
        // Private 속성 이름은 앞에 밑줄`_`을 사용하세요.
        // "no-underscore-dangle": 2, // `_`를 쓰는 모든곳에 오류가 검출됨 ㅡ.ㅡ;

        /**
         * React Rule
         */
        // JSX 속성(attributes)에는 항상 큰 따옴표(")를 사용합니다.
        "jsx-quotes": [2, "prefer-double"],
        // `displayName`을 이용하여 컴포넌트명을 정하지 않습니다.
        //"react/display-name": 1,
        // "react/forbid-prop-types": 1,
        // 명시적으로 true 값을 가지는 prop은 그 값을 생략할 수 있습니다.
        "react/jsx-boolean-value": 1,
        // 컴포넌트의 속성(properties)을 여러 줄에 있는 경우, 닫는 태그는 다음 줄에 작성합니다.
        "react/jsx-closing-bracket-location": 1,
        // Enforce or disallow spaces inside of curly braces in JSX attributes
        "react/jsx-curly-spacing": [2, "never"],
        // Enforce event handler naming conventions in JSX
        "react/jsx-handler-names": 1,
        // Validate props indentation in JSX
        "react/jsx-indent-props": [2, 2],
        // Validate JSX indentation
        "react/jsx-indent": [1, 2],
        // Validate JSX has key prop when in array or iterator
        "react/jsx-key": 1,
        // Limit maximum of props on a single line in JSX
        //"react/jsx-max-props-per-line": [1, { "maximum": 3 }],
        // `render` 메소드에서 이벤트 핸들러에 `bind`가 필요한 경우에는 `constructor`에서 합니다.
        "react/jsx-no-bind": 1,
        // 컴포넌트의 속성(properties)을 여러 줄에 있는 경우, 닫는 태그는 다음 줄에 작성합니다.
        "react/jsx-no-duplicate-props": 1,
        // Prevent usage of unwrapped JSX strings
        //"react/jsx-no-literals": 1,
        // Disallow undeclared variables in JSX
        "react/jsx-no-undef": 1,
        // React 컴포넌트의 참조 이름에는 PascalCase(대문자로 시작)를 사용니다.
        "react/jsx-pascal-case": 1,
        // Enforce quote style for JSX attributes
        "react/jsx-quotes": [1, "double", "avoid-escape"],
        // Enforce propTypes declarations alphabetical sorting
        //"react/jsx-sort-prop-types": 1,
        // Enforce props alphabetical sorting
        //"react/jsx-sort-props": 1,
        // Prevent React to be incorrectly marked as unused
        "react/jsx-uses-react": 1,
        // Prevent variables used in JSX to be incorrectly marked as unused
        "react/jsx-uses-vars": 1,
        // Prevent usage of dangerous JSX properties
        "react/no-danger": 1,
        // Prevent usage of deprecated methods
        "react/no-deprecated": 1,
        // Prevent usage of setState in componentDidMount
        "react/no-did-mount-set-state": 1,
        // Prevent usage of setState in componentDidUpdate
        "react/no-did-update-set-state": 1,
        // Prevent direct mutation of this.state
        "react/no-direct-mutation-state": 1,
        // `isMounted`는 사용하지 않습니다. ES6에서는 사용할 수 조차 없음
        "react/no-is-mounted": 1,
        // Prevent multiple component definition per file
        "react/no-multi-comp": [1, { "ignoreStateless": true }],
        // Prevent usage of setState
        //"react/no-set-state": 1,
        // Prevent using string references in ref attribute.
        //"react/no-string-refs": 1,
        // Prevent usage of unknown DOM property (fixable)
        "react/no-unknown-property": 1,
        // Enforce ES5 or ES6 class for React Components
        "react/prefer-es6-class": [1, "always"],
        // Prevent missing props validation in a React component definition
        //"react/prop-types": 1,
        // Prevent missing React when using JSX
        "react/react-in-jsx-scope": 1,
        // Restrict file extensions that may be required
        "react/require-extension": 1,
        // 자식(children)을 가지지 않는다면 항상 자신을 닫는(self-close) 태그로 작성합니다.
        "react/self-closing-comp": 1,
        // Enforce component methods order
        //"react/sort-comp": 1,
        // JSX 태그가 감싸여(Wrap) 있어 한 줄 이상인 경우 괄호(parentheses)를 사용합니다.
        "react/wrap-multilines": 1
    }
}