eslint란 lint란 에러가 있는 코드에 표시를 하는 것을 말하낟. 에러와 코딩 스타일을 잡아주기 떄문에 여러 명이 협업을 하며 코드를 작성하더라도 한사람이 코딩한 것 처럼 깔끔하게 정리할 수 있다.
Eslint는 ecma script와 lint를 합친 말로 자바스크립트 코드의 에러를 표시한다.
module.exports = {
parser: '@typescript-eslint/parser',
parserOptions: {
project: 'tsconfig.json',
tsconfigRootDir : __dirname,
sourceType: 'module',
},
plugins: ['@typescript-eslint/eslint-plugin'],
extends: [
'plugin:@typescript-eslint/recommended',
'plugin:prettier/recommended',
],
root: true,
env: {
node: true,
jest: true,
},
ignorePatterns: ['.eslintrc.js'],
rules: {
'@typescript-eslint/interface-name-prefix': 'off',
'@typescript-eslint/explicit-function-return-type': 'off',
'@typescript-eslint/explicit-module-boundary-types': 'off',
'@typescript-eslint/no-explicit-any': 'off',
},
};
이런 구조로 작성이되며 코드를 작성하다가, eslint에서 정해놓은 규정에 맞지않으면 빨간줄이 생길 수 있다.
prettier는 파일을 저장할 때마다, 코드를 사용자가 원하는 형식으로 모양을 예쁘게 만들어주는 node.js패키지이다. 파일을 저장할 때마다 일관성있도록 코드를 짤 수 있게 도와준다.
prettier 기본구조
{
"singleQuote": true,
"trailingComma": "all",
"tabWidth": 2
}
singleQuote : 문자열 입력시 "을 쓸지 ' 를 사용할지 설정할 수 있게 한다.
tabWidth : 들여쓰기의 크기를 정한다.
trailingComma : 객체 또는 배열이 여러줄로 구성되어 있어 다음과 같이 맨 마지막 줄에 쉼표를 붙여줄지 설정하느 기능이다.