naver / eslint-config-naver Goto Github PK

Naver JavaScript Coding Conventions rules for eslint

License: MIT License

JavaScript 100.00%

eslint eslint-config naver coding-standards javascript

eslint-config-naver's Introduction

아쉽게도 현재 해당 저장소를 운영하고 있지 않습니다. 여러 곳에서 아직 사용하고 있긴 하지만 부분적으로 수정해서 사용하고 있는 상황이고 예전 버전이라 운영하지 않기로 결정했습니다. 가능하면 원본 저장소를 참고해주세요.

감사합니다.

Naver Javascript Coding Conventions

eslint-config-naver는 네이버 자바스크립트 코딩컨벤션을 지원하는 eslint 룰 셋입니다.
eslint-config-naver는 eslint-config-airbnb-base 룰셋 기준으로 작성되었습니다.

eslint-config-naver는 2개의 룰 셋을 제공합니다.

ES6+ 룰 셋 : naver

ES5 룰 셋 : naver/es5

Install

#npm install eslint-config-naver

Usage

ES6+ 룰 셋을 사용하는 경우

// .eslintrc 파일
{
  "extends": "naver",
  "rules": {
    // 프로젝트별 적용할 Rules
  }
}

ES5 룰 셋을 사용하는 경우

// .eslintrc 파일
{
  "extends": "naver/es5",
  "rules": {
    // 프로젝트별 적용할 Rules
  }
}

Naver JavaScript Style Guilde

상세한 내용은 다음의 JavaScript 스타일 가이드를 참조하세요

Naver JavaScript Style Guilde

License

eslint-config-naver is released under the MIT license.

Copyright (c) 2019 NAVER Corp.

Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in
all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.  IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
THE SOFTWARE.

eslint-config-naver's People

Contributors

Stargazers

Watchers

Forkers

mixed rubythonode sculove savasrva mohwa laziel arkist joohee-lgtm bebop14 changhyun-insa jaeyeophan weumj gaepury kignues enomine kangsanchang c17an wogns0197 jinho-do positive-conative kangyerim sgh002400 coreight98 kernaldpark chaltteog uronly14me xidoweb nayeon0731 jnu-erdiin parkchanghyuk kimorkim conan1207 coolio-so hongsuyeon jaeminpark-dev wmakerjun salada17 2jaebbang wjunhee102 beaever wlsdk7245 yoona-j taek0622 sukam09 falsy boleesystem yoonjaej3 pastelmind youtu9977 lihiscaru seandoesdev whaleinmilktea gyulbong

eslint-config-naver's Issues

네임스페이스 명명 규칙을 추가한다.

스트링 표현시 홑따옴표를 기본으로 하는게 어떨까요?

이미 익숙한 분들도 많겠지만..

스트링 표현시 겹따옴표 보다는 홑따옴표를 기본으로 쓰는것이 shift 키를 쓰지 않아도 되고, html 문자열 표현시에도 이점이 있을것 같습니다.

다른분들은 어떠신가요?

줄바꿈 방식 crlf vs lf ?

줄바꿈 방식에 대한 정의는 별도로 없는것 같아 의견 남겨 봅니다.
줄바꿈 방식이 다르면 불필요한 diff 가 발생할 수도 있습니다.

https://help.github.com/articles/dealing-with-line-endings/

이렇게 git 설정을 하기도 하지만, .editorconfig 설정으로 IDE 단에서 강제하는것이 제일 좋은 방법인것 같은데요..
이 부분도 정의를 하는게 어떨까요?

package 의존 목록 중 취약점 있는 패키지 업데이트

https://github.com/naver/eslint-config-naver/network/dependencies

Versions of ansi-regex >2.1.1 <5.0.1 are vernerable to Inefficient Regular Expression Complexity

# npm audit report

ansi-regex  >2.1.1 <5.0.1
Severity: moderate
 Inefficient Regular Expression Complexity in chalk/ansi-regex - https://github.com/advisories/GHSA-93q8-gq69-wqmw
fix available via `npm audit fix --force`
Will install [email protected], which is a breaking change
node_modules/eslint-config-naver/node_modules/ansi-regex
node_modules/eslint-config-naver/node_modules/string-width/node_modules/ansi-regex
node_modules/inquirer/node_modules/ansi-regex
node_modules/inquirer/node_modules/strip-ansi/node_modules/ansi-regex
  strip-ansi  4.0.0 - 5.2.0
  Depends on vulnerable versions of ansi-regex
  node_modules/eslint-config-naver/node_modules/string-width/node_modules/strip-ansi
  node_modules/eslint-config-naver/node_modules/strip-ansi
  node_modules/inquirer/node_modules/string-width/node_modules/strip-ansi
  node_modules/inquirer/node_modules/strip-ansi
    eslint  4.5.0 - 7.15.0
    Depends on vulnerable versions of inquirer
    Depends on vulnerable versions of strip-ansi
    Depends on vulnerable versions of table
    node_modules/eslint-config-naver/node_modules/eslint
      eslint-config-naver  1.0.1 || >=2.0.0
      Depends on vulnerable versions of eslint
      node_modules/eslint-config-naver
    inquirer  3.2.0 - 7.0.4
    Depends on vulnerable versions of string-width
    Depends on vulnerable versions of strip-ansi
    node_modules/inquirer
    string-width  2.1.0 - 4.1.0
    Depends on vulnerable versions of strip-ansi
    node_modules/eslint-config-naver/node_modules/string-width
    node_modules/inquirer/node_modules/string-width
      table  4.0.2 - 5.4.6
      Depends on vulnerable versions of string-width
      node_modules/eslint-config-naver/node_modules/table

7 moderate severity vulnerabilities

Versions of eslint-utils >=1.2.0 or <1.4.1 are vulnerable to Arbitrary Code Execution.

USERui-MacBook-Pro:driver-license user$ npm audit --registry=https://registry.npmjs.org

                                                                                
                       === npm audit security report ===                        
                                                                                
# Run  npm update eslint-utils --depth 3  to resolve 1 vulnerability
┌───────────────┬──────────────────────────────────────────────────────────────┐
│ Critical      │ Arbitrary Code Execution                                     │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Package       │ eslint-utils                                                 │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Dependency of │ eslint-config-naver [dev]                                    │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ Path          │ eslint-config-naver > eslint > eslint-utils                  │
├───────────────┼──────────────────────────────────────────────────────────────┤
│ More info     │ https://npmjs.com/advisories/1118                            │
└───────────────┴──────────────────────────────────────────────────────────────┘


found 1 critical severity vulnerability in 901864 scanned packages
  run `npm audit fix` to fix 1 of them.

https://www.npmjs.com/advisories/1118
https://github.com/naver/eslint-config-naver/blob/master/package-lock.json#L223

스타일가이드에서 언급한 내용과 동일한 eslint 룰은 표기하자.

-현재는 airbnb 기준으로 이관한 것이고, 추가적으로 적용된 옵션도 추가하자!

template literal인 경우 줄바꿈 규칙을 구체화 하면 좋겠다.

예

var stringValue = `첫번째줄
두번째줄
세번째줄`;

[release] v2.0.2

#23

#22

#17

현재, 2.0.1-snapshot 으로 버전 설정되어 있음

스타일 가이드에서 링크가 안되는 것이 존재

22.9 ~ 22
25.2

parserOptions.ecmaFeatures.experimentalObjectRestSpread' option is deprecated

lint 체크 시

[ESLINT_LEGACY_OBJECT_REST_SPREAD] DeprecationWarning: The 'parserOptions.ecmaFeatures.experimentalObjectRestSpread' option is deprecated. Use 'parserOptions.ecmaVersion' instead. (found in "node_modules/eslint-config-naver/eslint-config-airbnb-base/index.js")

메세지가 뜹니다.
eslint-config-airbnb-base 변경사항에 따른 영향이라 생각되어집니다.

해당 경로 index.js에서 ecmaFetures속성 제거 부탁드립니다.

스타일 가이드에서 3.8 룰의 해석에 오류가 있는것 같습니다.

스타일 가이드

Object.assign은 오브젝트를 얕은 복사(shallow-copy) 하기 때문에, 가급적이면 spread 연산자(...)나 rest 파라미터(...)를 사용한다.

airbnb 원문

Prefer the object spread operator over Object.assign to shallow-copy objects. Use the object rest operator to get a new object with certain properties omitted.

shallow-copy를 하기 위해서 Object.assign 보다는 spread를 선호한다. 오브젝트에서 몇몇 속성을 제거한 새로운 오브젝트를 얻을때는 rest 오퍼레이터를 사용해라. 정도가 오해가 적은 해석 같습니다.

Prefer single quotes

More JavaScript teams do this (e.g. airbnb, standard, npm, node, google/angular, facebook/react, prettier).
It's easier to type (no shift needed on most keyboards).
Allows easier write html within javascript
Single quotes can often look better when you're using them to represent an empty string '' vs "" (too many little marks in the latter and can be difficult read)

v1.0.1 호환성 이슈

eslint-config-naver를 사용하는 프로젝트의 eslint 의존성이 다음과 같이 되어있는 경우 호환성 문제가 발생합니다.

{
    "eslint": "^3.x.x",
    "eslint-config-naver": "^1.0.0"
}

eslint-config-naver를 설치하면 [email protected] 가 설치됩니다.
1.0.1 버전은 eslint-4.x.x 룰셋을 사용하고, 프로젝트에 설치되는 eslint-3.x.x 이기 때문에 다음 에러가 발생합니다.

스타일 가이드에 why가 명시되면 좋겠다.

[DeprecationWarning] eslint-config-airbnb-base `ecmaFeatures` config

Reference

airbnb/javascript@0d938ae

error log

(node:71657) DeprecationWarning: [eslint] The 'ecmaFeatures' config file property is deprecated, and has no effect. (found in /Users/user/study/webpack-study/template/node_modules/eslint-config-naver/eslint-config-airbnb-base/legacy.js)
    at lodash.memoize.source (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-validator.js:208:6)
    at memoized (/Users/user/study/webpack-study/template/node_modules/lodash/lodash.js:10551:27)
    at validateConfigSchema (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-validator.js:225:9)
    at Object.validate (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-validator.js:238:5)
    at loadFromDisk (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:516:19)
    at load (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:559:20)
    at configExtends.reduceRight (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:425:36)
    at Array.reduceRight (<anonymous>)
    at applyExtends (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:403:26)
    at loadFromDisk (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:523:22)
    at load (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:559:20)
    at configExtends.reduceRight (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:425:36)
    at Array.reduceRight (<anonymous>)
    at applyExtends (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:403:26)
    at loadFromDisk (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:523:22)
    at Object.load (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config/config-file.js:559:20)
    at Config.getLocalConfigHierarchy (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config.js:227:44)
    at Config.getConfigHierarchy (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config.js:179:43)
    at Config.getConfigVector (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config.js:286:21)
    at Config.getConfig (/Users/user/study/webpack-study/template/node_modules/eslint/lib/config.js:329:29)
    at processText (/Users/user/study/webpack-study/template/node_modules/eslint/lib/cli-engine.js:163:33)
    at CLIEngine.executeOnText (/Users/user/study/webpack-study/template/node_modules/eslint/lib/cli-engine.js:620:17)
    at lint (/Users/user/study/webpack-study/template/node_modules/eslint-loader/index.js:229:17)
    at Object.module.exports (/Users/user/study/webpack-study/template/node_modules/eslint-loader/index.js:224:21)
    at LOADER_EXECUTION (/Users/user/study/webpack-study/template/node_modules/loader-runner/lib/LoaderRunner.js:119:14)
    at runSyncOrAsync (/Users/user/study/webpack-study/template/node_modules/loader-runner/lib/LoaderRunner.js:120:4)
    at iterateNormalLoaders (/Users/user/study/webpack-study/template/node_modules/loader-runner/lib/LoaderRunner.js:229:2)
    at Array.<anonymous> (/Users/user/study/webpack-study/template/node_modules/loader-runner/lib/LoaderRunner.js:202:4)
    at Storage.finished (/Users/user/study/webpack-study/template/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:43:16)
    at provider (/Users/user/study/webpack-study/template/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:79:9)
    at /Users/user/study/webpack-study/template/node_modules/graceful-fs/graceful-fs.js:78:16
    at FSReqWrap.readFileAfterClose [as oncomplete] (fs.js:505:3)

JS 스타일가이드 18.6 내용질문

18.6 메서드 체인이 2개를 초과한 경우, 적절히 줄 바꿈을 하여 사용한다. 메서드 체이닝을 하여 줄바꿈을 할 때에는 마침표(.) 다음에 줄 바꿈을 한다. 줄 바꿈 후에는 가독성을 위하여 자동 들여쓰기를 한다.

라고 정의되어 있는데, Bad와 Good의 예시가 이해가 안갑니다.
예시에 오류가 있는건지 궁금합니다.

PS. airbnb 코딩컨벤션과 비교해본 결과 룰은 바뀌었지만 예제를 그대로가져온것같습니다.

Versions of ansi-regex >2.1.1 <5.0.1 are vernerable to Inefficient Regular Expression Complexity

# npm audit report

ansi-regex  >2.1.1 <5.0.1
Severity: moderate
 Inefficient Regular Expression Complexity in chalk/ansi-regex - https://github.com/advisories/GHSA-93q8-gq69-wqmw
fix available via `npm audit fix --force`
Will install [email protected], which is a breaking change
node_modules/eslint-config-naver/node_modules/ansi-regex
node_modules/eslint-config-naver/node_modules/string-width/node_modules/ansi-regex
node_modules/inquirer/node_modules/ansi-regex
node_modules/inquirer/node_modules/strip-ansi/node_modules/ansi-regex
  strip-ansi  4.0.0 - 5.2.0
  Depends on vulnerable versions of ansi-regex
  node_modules/eslint-config-naver/node_modules/string-width/node_modules/strip-ansi
  node_modules/eslint-config-naver/node_modules/strip-ansi
  node_modules/inquirer/node_modules/string-width/node_modules/strip-ansi
  node_modules/inquirer/node_modules/strip-ansi
    eslint  4.5.0 - 7.15.0
    Depends on vulnerable versions of inquirer
    Depends on vulnerable versions of strip-ansi
    Depends on vulnerable versions of table
    node_modules/eslint-config-naver/node_modules/eslint
      eslint-config-naver  1.0.1 || >=2.0.0
      Depends on vulnerable versions of eslint
      node_modules/eslint-config-naver
    inquirer  3.2.0 - 7.0.4
    Depends on vulnerable versions of string-width
    Depends on vulnerable versions of strip-ansi
    node_modules/inquirer
    string-width  2.1.0 - 4.1.0
    Depends on vulnerable versions of strip-ansi
    node_modules/eslint-config-naver/node_modules/string-width
    node_modules/inquirer/node_modules/string-width
      table  4.0.2 - 5.4.6
      Depends on vulnerable versions of string-width
      node_modules/eslint-config-naver/node_modules/table

7 moderate severity vulnerabilities

eslint 4.0 지원

yarn pnp 지원문의

@boxersb 님 안녕하세요
�현재 진행중인 프로젝트에서 yarn berry (pnp) 방식으로 eslint-config-naver 를 세팅할때 의존성 에러 발생해서 문의드립니다.

https://github.com/naver/eslint-config-naver/blob/master/package.json 을 보면 eslint-config-airbnb-base 에 대한 의존선언이 되지 않아 묵시적인 참조가 안되는 pnp 에서는 경로를 찾지 못하는데요.

우선은 직접 의존을 선언해서 사용중입니다. 한번 확인 부탁드립니다.

    "eslint": "^8.53.0",
    "eslint-config-airbnb-base": "^15.0.0",
    "eslint-config-naver": "^2.1.0",
    "eslint-plugin-import": "^2.29.0"

두가지 룰의 상호 간섭으로 인한 고민 공유

안녕하세요. FE 플랫폼 박성현입니다.
eslint-config-naver 룰 사용 중 고민이 되는 컨벤션이 있어서 질문차 이슈 올립니다.

상황

아래 ES5 코드를 ES6 로 전환하려 했습니다.

days.map(function (day) {
  return (day < 10) ? "0"+day : ""+day;
});

코드는 숫자 배열(1 ~ 31)을, 자리수에 따라 적절하게 문자 배열(01 ~ 31)로 바꿉니다.
날짜 포맷팅을 위해 하는 건데요. ES6 코드로는 아래처럼 변경되길 원했습니다.

days.map(day => day < 10 ? `0${day}` : `${day}`);

그런데 이 코드는 아래 룰을 위반했기 때문에 lint 과정에서 에러를 뿜어냅니다.

no-confusing-arrow: arrow 함수 내에서 비교 연산자와 헷갈릴 가능성이 있을 땐, 괄호 없이 사용하지 못한다.

그래서 바꾼 코드입니다.

// step 1 code, no-confusing-arrow 룰 해결
days.map(day => {
  return day < 10 ? `0${day}` : `${day}`;
});

하지만 이 코드는 아래 룰을 위반합니다..

arrow-body-style: arrow 함수의 {} 는 필요할 때만 사용한다

결국 최종적으로 아래 코드로 변환했습니다.

// step 2 code, final code
days.map(day => {
  const converted = day < 10 ? `0${day}` : `${day}`;

  return converted;
});

이슈

결국 no-confusing-arrow 룰과 arrow-body-style 룰이 상호 간섭하는 이슈인데요.
이후 메서드 체이닝까지 생각해봤을 때, 최종 변환된 코드는 조금 ugly 하지 않나 생각이 듭니다.

질문

이 이슈에 대해서 어떤 생각이 가지고 계신지 한번 의견을 나눠봤으면 합니다. 저만 불편한 건가요?

tab 스타일이 가져오는 불편한 경험 공유

github 에서 tab 크기를 8로 인식하는 것 때문에, 불편한 경험들이 종종 있었습니다. 특히 아래 케이스에서요.

개발툴에서는 주석의 시작 column 위치를 동일하게 맞춰놓았는데, 정작 github 에서는 맞지 않더라구요.
이슈가 있는건 아닌데 항상 거슬렸습니다 😢

// space 로 맞춘 경우
class Something {
  foo = "twice longer than short value";  // ...
  bar = "short value";                    // ...
}

// tab 으로 맞춘 경우
class Something {
	foo = "twice longer than short value";	// ...
	bar = "short value";					// 안맞아요 ㅜㅜ
}

물론 주석을 value 바로 옆에 작성하는 경우도 있지만, 필드가 많은 경우, 위처럼 주석 위치를 맞추는게 관심사 분리에 좋다고 생각하는 편입니다.

동일하게 생각하는 분들이 많다면, 개선 방향을 잡아도 되지 않을까 생각하는데요~

naver / eslint-config-naver Goto Github PK

eslint-config-naver's Introduction

Naver Javascript Coding Conventions

eslint-config-naver는 2개의 룰 셋을 제공합니다.

Install

Usage

ES6+ 룰 셋을 사용하는 경우

ES5 룰 셋을 사용하는 경우

Naver JavaScript Style Guilde

License

eslint-config-naver's People

Contributors

Stargazers

Watchers

Forkers

eslint-config-naver's Issues

Reference

상황

이슈

질문

Recommend Projects

Recommend Topics

Recommend Org