본문 바로가기

Bower

Bower 란?

bower는 npm과 비슷한 도구이지만 트위터에서 만든 프론트 엔드의 패키지를 관리해주는 도구이다.

bower도 npm과 마찬가지로 설치뿐만 아니라 의존성까지 해결해준다. 이 얼마나 편한가?

여기서 의존성에 대해 설명을 하자면 Bootstrap 같은 경우 Jquery 기반이라 Jquery 파일을 먼저 불러오고 나서 Bootstrap의 .js 파일들을 불러와야한다.

그래서 보통은 아래와 같이 많이 사용한다

 

<script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/bootstrap/js/bootstrap.min.js"></script>

위와 같이 라이브러리 안에 필수적으로 필요한 라이브러리를 의존한다고해서 의존성이라고 표현한다.

실제로 bower만으로는 의존성이 해결되지는 않으나 gulp or grunt를 같이 사용하면 어느정도 해소는 된다.

 

Bower 명령어

 

bower를 이용하여 패키지를 설치를 하고 싶은경우 bower install이라는 명령어를 이용하면 패키지가 설치가 가능하다.

 

bower install <패키지명>

Bower.json

bower의 경우도 npm과 마찬가지로 패키지 명시를 파일로 관리하게된다. npm은 package.json을 이용하여 관리하였지만 bower는 bower.json 파일로 관리하게되며 마찬가지로 bower init 명령어를 통하여 쉽게 생성이 가능하다.

 

{
  "name": "packageName",
  "version": "0.0.1",
  "ignore": [
    "**/.*",
    "node_modules",
    "components"
  ]
}

 

각 항목에 대해 간략하게 살펴보면

Name

필수값이며, 패키지 명칭이다 npm과 마찬가지고 패키지의 명칭을 이용하여 install이 가능하다.

version

패키지 버전정보 사실 bower로 배포하는게 아니라면 크게 의미없는 항목이다.

ignore

bower가 설치할때 무시할 항목이다.

dependencies/devDependencies

의존성 관리 항목이다. dev가 붙은건 개발시에만 필요한 의존성 라이브러리로 bower에 배포할게 아니라면 크게 구분할 의미가 없다.