웹팩에 대하여

 

---

웹팩의 장점
1.웹 개발작업 자동화
2.웹 애플리케이션의 빠른 로딩,성능

HTTP요청 숫자의 제약
:웹 앱의 성능을 높혀줌.

Node.js란
브라우저 밖에서도 JS를 실행할 수 있는 환경
즉,Node.js가 나오기 전에는 
브라우저 내에서 실행되는 언어임에 한정되었는데
Node.js가 나오고 난 이후로 브라우저 밖에서도 
JS를 실행할 수 있게되었다.

NPM이란
명령어로 자바스크립트 라이브러리를 
설치하고 관리할수 있는 패키지 메니저이다.

NPM명령어

npm install library
==
npm i library

npm install명령어로 라이브러리를 설치하면
node_module이라는 폴더가 생긴다
그 폴더 내에는 각종 라이브러리가 위치해있는것을
알 수 있다.

npm install library --global
== 전역 설치

전역 설치를 하게 되면, 시스템 레벨에서 
라이브러리를 사용할 수 있게된다.

# window
%USERPROFILE%\AppData\Roaming\npm\node_modules

# mac
/usr/local/lib/node_modules

이런 파일들에 라이브러리가 설치가 될것이다.

npm install library --save-dev
=devDependencies에 저장이 됨.

여기서 dependencies와 devDependencies
의 차이점은 
dependencies = 배포용
devDependencies = 개발용

npm run build를 하게되면 
배포를 하게 되는데, dependencies의
값을 포함시키고 devdependencies는 
코드에서 빠지게 된다.
webpack : 빌드 도구
eslint : 코드 문법 검사 도구
imagemin : 이미지 압축 도구

이러한 것들이 개발의존성에 들어가게 되는것이다

npm 커스텀 명령어
npm의 명령어를 사용자가 이름과 동작을 정의해서
사용할 수 있다.

package.json에 
{
  ...
  "scripts": {
    "hello": "echo hi"
  }
}
이렇게 작성을 하고
npm run hello를 하게되면
echo hi라는 명령어가 실행되게 된다.

npm 커스텀 명령어는 다른 명령어와 조합해서 사용할 수 있다.

 

캡틴판교님의 웹팩핸드북을 보고 간단하게 정리를 해보았다...

다음에는 웹팩을 실제로 빌드를 해보겠다