2019-06-03 npm, babel, webpack

npm

node package manager

 

node.js를 설치하면 npm도 따라서 설치가 됨. 하지만, 최신버젼의 노드js를 설치하여도 npm이 최신이 아닌경우가 있음.

(그래서 npm을 업데이트를 따로 진행하는것이 좋음.)

메이저 버전을 6.대 버전을 까는것이 좋음. 

 

모듈기능 독립적으로 실행가능한 별도의 프로그램, 따로 동작하는것이 아니라 메인프로그램에 레고를 조립하듯이 조립해서 쓸 수 있는 하나의 코드조합을 의미. 

;

 

<script type="module" src="lib.mjs"></script>
<script type="module" src="app.mjs"></script>

위처럼 쓰면, 파일레벨 스코프를 가진다.

파일별로 파일 스코프를 가져야한다. 

내가만든 파일스코프에서 외부에 공개해야할 것과 비공개할것을 구분해야함.

script 태그에 type="module" 어트리뷰트를 추가하면 로드된 자바스크립트 파일은 모듈로서 동작한다. 모듈의 파일 확장자는 mjs를 권장한다.

 

 

잘 읽어보기

https://d2.naver.com/helloworld/12864

불러오는 중입니다...

 

npm install <package>  // 라이브러리 모듈, 패키지명은 npm사이트(mpmjs.com)에서 키워드를 입력하면 나옴.

 

--save -dev는 개발시에 필요한거지 배포할때 필요한 것이 아니다.

npm install --save-dev <package> // 개발할때 필요한거지 배포할때 필요한 것이 아니다.

 

메이저 버전 / 마이너버전 / 패치 버전 으로 나뉜다.

 

~(틸트)와 ^(캐럿)의 차이

 

~(틸트)는 패치 버전 범위 내에서 업데이트한다. :

• ~0.0.1 : 0.0.1 <= version < 0.1.0
• ~0.1.1 : 0.1.1 <= version < 0.2.0

^(캐럿)는 마이너 버전 범위 내에서 업데이트한다. :

• ^1.0.2 : 1.0.2 <= version < 2.0

 

Babel

ES6이상의 코드를 ES5이하의 버전으로 떨군다.

 

Babel ES6로 코딩해서 마음껏 쓰더라도 ES5로 떨어뜨려주는것

Webpack 100개의 파일을 하나의 파일로 묶어주면서 불필요한 space 제거해서 한줄로 나열.