ESLint Prettier.....

Hansol Oh·2021년 7월 14일
0

관련 에러를 고치기 위한......또 한번의 여정.....여러가지 시도들...
기록해둔 오류 메세지는

Delete ·· (prettier/prettier) at
Insert ␍⏎ (prettier/prettier) at
Replace ········ with ···· (prettier/prettier) at 등,...............

  1. 해당 workspace 에 prettier 우클릭 - disabled

  2. settings.json

"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
},

"eslint.alwaysShowStatus": true,
"eslint.workingDirectories": [
"./vue-til"
],

"eslint.validate": [
"javascript",
"typescript"
],
//.eslintrc.js 
useTabs: false,
//eslintrc.js 
rules: {
        'prettier/prettier': [
            'error',
            {
                endOfLine: 'auto',
            },
        ],
    },

4-2.

endOfLine: 'off'
//.eslintrc.js - rules:
"indent": [ "error", 2 ],
  1. vs code 우측 하단 UTF-8과 언어JavaScript 사이 CRLF -> LF
    'Select End of Line Sequence'

  2. formatOnSave 는 prettier와 포맷 충돌이 발생하므로 false를 선언해줍니다.

 // ESLint
"eslint.validate": [ "javascript", "javascriptreact", "html", "typescriptreact" ],
  1. Yarn run lint — fix 아직 안해봄

  2. error Replace ·· with prettier/prettier

저 에러는 코드 들여쓰기를 탭 대신 스페이스바 두개로 해서 그런데요

vscode 설정 가셔서 indentation 검색하시고 3번째 "editor: insert spaces" 체크 해제하시면 됩니다.

수업에서 .eslintrc.js파일에 "useTabs: true" 규칙을 추가했는데 vscode의 insert spaces 설정 때문에 충돌이 일어나고 있었어요

그리고 이미 space로 들여쓰기가 되어있던 기존 코드들은 vscode 맨 아래 상태바에 "Tab Size:2" (또는 "Spaces:2"로 표시) 부분 누르시고 convert indentation to Tabs 선택하시면 됩니다. 아마 각 파일마다 해주셔야될거에요


+

  • linter는 소스코드를 분석해서 문법 에러, 버그를 찾고 보고해주는 도구
  • Prettier는 코드에 적용되어 있던 원래 스타일을 깡그리 무시하고, 줄 길이를 고려해서 정해진 규칙대로 다시 써서 내보냅니다. 따라서 일관된 코드 스타일을 전체 코드 베이스에 강제합니다.
profile
Hello Velog😎

0개의 댓글

Powered by GraphCDN, the GraphQL CDN