apply eslint at window os

1. node install

 

2. npm 환경설정

윈도우7 에서 node.js / npm 환경변수 설정 하기

1.nodejs 를 설치를 했으나 npm 이 동작을 하지 않을경우에 대한 대응문서

노드(nodejs)를 윈도우 버젼을 설치하게되면 전역에서 사용할 수 있게 설정해야 하는데

이를 위해서 환경변수 설정을 해줍니다.

일단 node.js 윈도우 버젼을 설치 했다는 가정하에 글을 올립니다.

npm 은 설치시에 아래 그림의 경로에 설치가 됩니다.

(컴퓨터마다 환경을 약간씩 틀릴 수 있으며 softzone 대신에 다른 이름일 수 있습니다.)

윈도우의 경로 주소중 사용자 라는 폴더 경로는 윈도우에서 users 가 됩니다.

 

환경변수에 추가해줄 주소는

 

C:\Users\softzone\AppData\Roaming\npm

이 되는것 입니다.

내컴퓨터 -> 속성

하단의 메뉴중에서 환경변수 를 클릭해 줍니다.

1. 사용자정의변수

위 그림처럼 사용자 변수(U) 에서 새로만들기(N) 버튼을 클릭한 뒤에
변수이름과 변수 값을 넣어줍니다.


2.시스템변수

node 환경변수 등록

제 NODE 의 경로는 C:\nodejs 이므로 새로 추가해서 넣어줘도 되겠으나

아래 그림처럼 기존에 있는 사용자 변수중에서 Path 부분을 클릭해서 넣어줬습니다.

Path 부분의 맨끝에 변수값에 C:\nodejs; 라고 넣어줬습니다.

환경변수는 ; (세미콜론)이 환경변수를 구분합니다.

예 ) C:\ABC.JS;C:\nodejs;

이렇게 npm 과 node 를 설정하시면 전역에서 사용할 수 있습니다.

환경변수 세팅후에 바로 사용이 가능하며 사용이 안될경우

재부팅후 사용하세요.

 

출처 :http://softzone205.blogspot.com/2017/08/node-npm-nodejs.html

3. eslint 설정

먼저 현재 프로젝트에 eslint npm 패키지를 설치합니다.npm install --save-dev eslint

설치가 완료되시면 프로젝트내 node_modules아래에 eslint가 생성되었는지 확인합니다.

그리고 ESLint 플러그인을 설치합니다.

(File > Settings > Plugins > Browse repositories... > Search: eslint > Install > IDEA Restart)

재시작 되어 설치가 완료되면 플러그인 설정을 진행합니다.
(맥OS 기준) command+shift+a로 Code Quality Tools를 검색하여 설정창을 오픈합니다.

해당 설정창에서 ESLint -> Enable 체크 -> node 위치 지정, (좀전에 설치한) ESLint npm 패키지 위치 지정

보통은 Enable 체크하면 IntelliJ가 직접 필요한 파일들의 위치를 자동으로 찾아줍니다.

IntelliJ 관련 설정은 이게 끝입니다.
이제는 airbnb eslint 설정을 진행하겠습니다.

먼저 airbnb-eslint와 관련된 eslint 기타 플러그인들을 설치하겠습니다.

npm install --save-dev eslint-plugin-import npm install --save-dev eslint-plugin-react npm install eslint-plugin-jsx-a11y@5.1.1 --save-dev

현재 (2017.10.03) eslint-config-airbnb의 버전인 15.1.0 에서는 eslint-plugin-jsx-a11y 5.1.1 버전이 필요한데 eslint-plugin-jsx-a11y가 현재 6.x.x 버전이 되어서 5.1.1 버전을 강제로 지정해서 install 합니다.

설치가 완료되셨으면 바로 eslint-config-airbnb를 설치하겠습니다.

npm install --save-dev eslint-config-airbnb

설치가 완료되셨으면 실제 프로젝트에 적용해보겠습니다.
프로젝트 내부에 .eslintrc 파일을 하나 생성합니다.
그리고 아래와 같이 airbnb 옵션을 추가합니다.

ES6와 Node 환경을 적용하기 위해 추가 설정도 포함합니다.

{ "env": { "node": true, "es6": true }, "extends": "airbnb" }

 

출처 : https://jojoldu.tistory.com/230

 

 

4. eslintignore로 eslint에서 체크안한 파일 작성

 

출처 :  https://www.zerocho.com/category/JavaScript/post/583231719a87ec001834a0f2