Home

오늘의 기억

[ESLint] ESLint (2) - Webpack 에서 ESLint 설정하기


이번에는 webpack 에다가 eslint 를 설정하는 법을 포스팅한다.


패키지 설치

eslint 를 사용하려면 eslint와, eslint-loader 패키지를 설치해야한다.

$ npm install eslint eslint-loader --save

webpack.config.js 설정

eslint 패키지를 설치하였으면 webpack.config.js 파일에 설정을 넣어주어야 한다.

module: {
  rules: [
    {
      enforce: 'pre',
      test: /\.js$/,
      loader: 'eslint-loader',
      exclude: /(node_modules)/
    }
  ]
}

module - rules에 추가하며 enforce 속성을 pre로 설정한다. 또한 eslint 를 적용할 파일을 js 확장자로 지정한다.

exclude 속성은 eslint 검사시 제외 할 디렉토리나 모듈을 설정한다.


eslint 설정

package.json 파일과 동일한 디렉토리에 .eslintrc.js 파일을 생성해서 eslint 설정을 입력한다. 외부에 공개된 설정으로 진행하고 싶으면 그냥 패키지만 받으면 된다.

또한 앞서 exclude 속성을 별도의 파일로도 관리할 수 있다.

마찬가지로 package.json 파일과 동일한 디렉토리에 .eslintignore 파일을 생성하여 계행 문자로 구분하여 linting 에 제외할 디렉토리나 파일을 설정할 수 있다.


같이 보기

20180913 Charyum.Park