ULISIA's Developer Life

이번 본문에서는 eslint와 prettier를 적용하고자 한다. eslint는 js linter의 한 종류. 코드를 실행하지 않아도 정적 분석을 통해 문법적 에러를 찾아주며 간단한 포맷팅 기능을 포함 prettier는 코드포맷터의 일종 npm i -D eslint eslint 설치 후 package.json에서 설치확인 마찬가지로 prettier도 설치확인 npm i --save-dev --save-exact prettier -D가 --save-dev 옵션의 줄임말 --save-exact 옵션을 사용하면 "^버전"에서 ^가 없이 설치됨 ^이 있는 경우는 버전을 지정하지 않은 채 설치하거나 --save-exact 옵션이 없는경우 ^의 의미는 해당 패키지가 업데이트 되었을 때 혹은 npm i 명령어를 사용..

module 속성을 추가해준다. css파일을 use 설정의 로더들을 사용해서 읽어들이겠다는 의미이다. module 속성은 프로젝트 내의 여러 유형의 모듈들을 처리할 방법을 결정 module.rules : 모듈이 생성 될 때 요청과 일치하는 규칙 의 배열 module.rules.test : loader를 적용시킬 파일들을 정규식으로 명시 module.rules.loader : 사용할 loader 명시 사용할 loader가 많을 경우엔 Rule.use:[ { loader }] 로 사용가능 Rules.loaders 는 Rule.use로 사용 Rules.loader: ['loader'] 처럼 배열로도 사용가능 로더는 여러 로더를 전달하여 연결될 수 있는데 오른쪽에서 왼쪽으로 적용된다는점이 주의사항이다. 위의 코..

VS Code와 node js, npm이 기본으로 설치가 되어 있는 상태에서 진행한다. (설치법은 검색엔진 아무곳에서 검색해보면 자세하게 설명된 곳이 많으므로 생략, 혹은 추후에 관련 글을 작성할 예정) 본문에서 세팅하고자 하는 Webpack은 module bundler로 간단히 설명을 하자면 웹 개발을 하기 위해서 필요한 html, css, js 등을 하나의 파일 혹은 여러개의 파일로 병합하거나 또는 압축해주는 역할을 한다고 볼 수 있다. VS Code를 실행한 후 아무 새폴더를 만든후에 터미널을 연다. 커맨드 라인에 다음과 같이 입력한다. npm init -y 그럼 다음과 같이 package.json을 초기화할 수 있다. package.json이 무엇인가? 기본적으로는 package.json은 문서다..