Notice
Recent Posts
Recent Comments
«   2024/04   »
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
Tags
more
Archives
Today
Total
관리 메뉴

김쨈창고

Grunt 본문

마크업/Grunt & Gulp

Grunt

류쨩 2014. 8. 27. 10:48

node.js

=> nodejs.org - 설치

grunt

=> task중심의 javascript 빌드 도구
grunt는 nodejs로.. javascript로 만들어진 glub이라는것도 있음
기본적으로 node.js가 설치되어야 함
설치명령어 npm install 모듈명

grunt(grunt-cli) 설치

  • npm install -g grunt-cli
    -g 옵션 : global옵션으로 시스템 전체에서 적용될 수 있도록 해주는 것, 최초 한 번만 적용해주면 됨
  • npm install -g grunt-init
    grunt-init : grunt 템플릿을 사용할 수 있도록 해주는 모듈

grunt 실행 환경 파일

package.json

  • npm모듈을 사용할 때의 정보를 가진 파일
  • npm install grunt --save-dev -> grunt 모듈을 package.json에 추가해주는 것
    --save-dev는 모듈정보를 package.json에 추가하는 명령어

Gruntfile.js

구성요소 : wrapper 함수, 프로젝트와 task환경설정, grunt plugin과 task로딩, 사용자 정의 task
task에서 target 실행 => grunt uglify:build
grunt.registerTask('task닉네임', task명)​으로 grunt uglify:task명을 하지 않고도 실행할 수 있다

* 두 개 파일의 위치는 프로젝트의 폴더에 있어야 함.
예로 프로젝트내 branches나 trunk에 있으면 프로젝트 폴더에서는 실행안되고 하위폴더로 가야만 실행이되므로, 프로젝트 폴더내 상위단에 있어야 한다.

grunt 실행 환경 마무리

​npm install
​npm install 을 실행전까지는 정보를 가지고만 있다가 npm install 명령어를 통해 해당 패키지를 불러와서 설치해주는 역할을 한다.
이 과정을 실행하면 node_moduls 폴더가 생성되고 하위로 패키지들이 설치된 파일을 확인할 수 있다.

​grunt-init 사용하기

  • ​grunt-init - 템플릿 여부 확인
  • grunt-init 템플릿명 - 템플릿 사용

​* dir /a or ls -a 폴더 내 숨김파일을 모두 볼 수 있는 명령어


  • npm update - 버전 업데이트 하는 것
  • npm virsion - 버전정보를 나타내는 것
  • npm view 패키지명 - 패키지 전체 정보를 다 볼 수 있는 것
  • npm view 패키지명 version - 해당 패키지의 버전정보만 나타내는 것
Comments