티스토리 뷰

정리하기/JS 관련

browserify

내가송 2017. 6. 29. 17:01
반응형

node.js는 기본으로 다른 모듈을 갖다가 사용하고자 할 때 

require 메소드를 이용하여 가져올 수 있도록 지원해준다. 


하지만, 브라우저 자체는 require 메소드가 undefined이기 때문에

브라우저 안에서 실행되는 코드에서 외부 모듈을 가져오기 위해 require문 사용 시,

에러를 맞이하게 된다 ㅠㅠ


바로 다음과 같은 상황


main.js

var unique = require('uniq');


var data = [1, 2, 2, 3, 4, 5, 5, 5, 6];


console.log(unique(data));


위의 코드는 uniq라는 모듈을 가져다가 동작을 하고 있다. 

우선 위의 코드를 브라우저에서 실행시키기 위해서는 uniq라는 모듈이 필요하다. 


npm으로 uniq 모듈을 설치한다. 


npm install uniq


하지만, 서버단이 아닌 클라이언트 단에서 위의 코드를 실행하게 되면

require문이 정의되어 있지 않으므로 (node 서버가 실행되고 있지 않으므로) 문제가 발생된다.

 

이런 상황에서 사용하는 것이 browserify다. 


npm install browserify  // 우선 browserify 설치

browserify main.js -o bundle.js


위와 같이 실행시, 

main.js라는 파일을 변환하여 bundle.js라는 파일로 새로 생성해준다. 


이로써 node 환경이 아닌 일반 브라우저 환경에서도 require문을 통해 모듈을 가져와도 문제 없이 실행된다


반응형

'정리하기 > JS 관련' 카테고리의 다른 글

AMD과 common.js (UMD)  (0) 2017.07.10
typescript ` 구문  (0) 2017.07.04
자바스크립트 객체  (0) 2017.05.28
undefined vs void 0  (0) 2017.05.16
apply, call, bind  (0) 2017.05.15
반응형
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday
링크
«   2024/12   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31
글 보관함