nextjs 썸네일형 리스트형 [Next.js] 기존 React 프로젝트 Next.js로 바꾸기 - 3 (TS, Styled-Component, SVG) ✏ TypeScript 적용하기 Next.js를 프로젝트를 시작할 때 TS를 적용한다. npm i next react react-dom npm i -D typescript @types/react @types/node 타입스크립트는 빌드 과정에서 자바스크립트로 변환되기 때문에 실제 배포될 결과물에는 포함되지 않는다. 따라서 -D 또는 --save-dev를 붙여 devDependencies에 추가하여 빌드 시에 모듈이 추가되지 않도록 한다. @types/로 시작하는 라이브러리는, 라이브러리의 타입을 나타낸다. 타입이 내장되어 있는 모듈도 있지만, 그렇지 않은 경우에는 추가적으로 설치해주어야 한다. ✏ TypeScript 사용하기 예제에서 만드는 투두리스트로 TS를 사용하는 방법을 알아본다. d.ts는 타입스.. 더보기 eslint 관련 내용 코드 짜면서 보는 애들 중 기록할만한 건 계속 추가해나갈 예정. array-callback-return 내가 자주 실수하는.. 중괄호를 열고 엔터치는 일이 많다보니, map의 결과로 jsx를 리턴할 때는 ()를 써야 하는데 습관적으로 {}를 써서 자주 에러를 보곤 한다 ㅎㅎ 근데 이 부분을 eslint가 바로 잡아줌! 쩐당 좋다! control-has-associated-label 스택오버플로우 서치해보니 버튼에 타이틀 혹은 라벨이 없을 때 에러를 발생시키는 듯 했다. aria-label을 추가해주면 에러가 사라진다. 추가하기 이 친구는 aria-label을 추가해주지 않아도 문제가 없다! no-case-declarations unexpected lexical declaration in case bloc.. 더보기 eslint: command not found 에러 | .eslintrc.js bash: eslint: command not found 책을 보고 따라하고 있었는데 명령어 eslint --init 에서 만난 에러 eslint는 자주 사용되니 -g 를 붙여 글로벌로 설치하라고 해서 했는데, 뭐 경로 문제인지 eslint를 찾지 못하는 거 같음? 공식문서를 보니 그냥 -g 없이 설치하길래 했더니 별 문제 없이 잘 되었다.. 그래서 일단 쓰는 중 $ npm install eslint --save-dev $ ./node_modules/.bin/eslint --init eslint An AST-based pattern checker for JavaScript. www.npmjs.com .eslintrc.js eslint --init하면 만들어준다. module.exports = { env:.. 더보기 이전 1 다음
