Managing the frontweb source with bower

bower 는 라이브러리 css, javascript,html 등의 frontweb 소스를 관리하는 노드 모듈중에 하나입니다. 저장소에 자신의 라이브러리를 올려놓기도하고, script 사이의 의존성 관리하기도 쉽습니다.

1. nodejs 를 먼저 설치합니다.

2. npm 을 활용하여 bower module 을 설치해줍니다.

   $ npm install -g bower
   $ bower help 
   

3. 설치가 완료되었으니 제가 주로 활용한 bower 명령어에 대해서 알아보겠습니다. 공식 API 문서 에서 더 많은 정보를 확인 하실수 있습니다. node 패키지 모듈을 관리하는 pakage.json 이 있듯이 bower 에서도 전체적인 관리를 하는 bower.json** 이라는 파일이 있습니다. 이를 따로 생성할 필요는 없고 다음 명령어를 통해서 생성할 수 있습니다.

   $ bower init
   

   ? name ddd
   ? description
   ? main file
   ? keywords
   ? authors Park keehyun <keehyun2@gmail.com>
   ? license MIT
   ? homepage
   ? set currently installed components as dependencies? Yes
   ? add commonly ignored files to ignore list? Yes
   ? would you like to mark this package as private which prevents it from being ac
   cidentally published to the registry? No
   
   {
    name: 'ddd',
    authors: [
      'Park keehyun <keehyun2@gmail.com>'
    ],
    description: '',
    main: '',
    license: 'MIT',
    homepage: '',
    ignore: [
      '**/.*',
      'node_modules',
      'bower_components',
      'test',
      'tests'
    ]
   }
   
   ? Looks good? Yes
   

4. 이제 bower jquery package 를 설치해보겠습니다.

   $ bower install jquery --save
   

   이후에 bower.json 안에 dependencies 가 추가되고 bower_components 안에 jquery 를 내려받습니다.

   ...  
    "dependencies": {
      "jquery": "^3.2.1"
    }
   ...
   

5. bower install 시에 여러가지 option 이 있습니다. -D (--save-dev) 옵션을 추가하여 개발시에만 package 를 사용하고 production 으로 배포시에는 해당 package 를 제외하도록 할수도 있습니다. 옵션들은 다음 명령어로 확인 하실 수 있습니다.

   $ bower install help
   

Registering the package (저장소에 패키지 등록하기)

1. 먼저 bower 저장소에 package로 등록을 하기 위해서는 bower.json 을 가진 github 저장소가 필요합니다. bower 저장소에는 source 은 올라가지 않고 단순히 package 명과 github 주소 의 mapping 정보만 저장됩니다. bower package 에 올릴 내용을 github 에 올려 놓습니다. 이후에 bower login 을 통해서 bower 저장소를 사용하기 위한 github 계정 인증을 받습니다.

2. 이번에는 개인적으로 jquery 를 활용하여 만든 함수들을 패키지 등록해보도록 하겠습니다. 먼저 제가 등록하려는 라이브러리 명으로 정보를 검색해보고 이미 등록된 내용이 있는지 찾아봅니다.

   $ bower info <패키지명>
   $ bower search <패키지명>
   

3. bower 저장소에 등록합니다.

   $ bower register <name> <url> 
   $ bower register <패키지명> <github주소>
   

4. 등록했던 패키지명으로 다시 조회 하면 등록된 정보를 확인할 수 있습니다. bower 패키지 검색 사이트 에서도 검색이 가능하지만 서버에 캐쉬가 남아있어서 그런지 바로 확인되지는 않습니다.

5. 패키지 삭제는 bower unregister 를 명령어를 통해서 할수 있습니다.

   $ bower unregister <패키지명>
   

   삭제 이후에 search 는 되지 않는데 info가 지워지지 않고 남아있는데 캐쉬를 삭제 하면 해결됩니다.

   $ bower cache clean
   

   ​