eslint를 적용하다가 계속 에러가 나서 결국 다시 처음부터 정리를 해보았다.
1. npx eslint —init
2. npm install prettier --save-dev --save-exact
3. prettierrc.json 만들기
// prettierrc.json
{
"arrowParens": "always",
"bracketSpacing": true,
"htmlWhitespaceSensitivity": "css",
"insertPragma": false,
"bracketSameLine": false,
"jsxSingleQuote": false,
"printWidth": 80,
"proseWrap": "preserve",
"quoteProps": "as-needed",
"requirePragma": false,
"semi": true,
"singleQuote": true,
"tabWidth": 2,
"trailingComma": "all",
"useTabs": false,
"vueIndentScriptAndStyle": false
}
4. npm install eslint-config-prettier eslint-plugin-prettier --save-dev
5. eslintrc.js 설정
// eslintrc.js
module.exports = {
env: {
browser: true,
node: true,
es2021: true,
},
extends: [
'plugin:react/recommended',
'airbnb',
'plugin:prettier/recommended',
],
parserOptions: {
ecmaFeatures: {
jsx: true,
},
ecmaVersion: 12,
sourceType: 'module',
},
plugins: ['react', 'prettier'],
rules: {
'react/jsx-filename-extension': [
'error',
{
extensions: ['.js', '.jsx'],
},
],
'prettier/prettier': [
'error',
{
endOfLine: 'auto',
},
],
'no-console': 'off',
},
};
여기까지 하니 정상적으로 적용이 되었다.