grunt 및 플러그 인 설치

전 제 는 전역 환경 에서 trunk 를 설치 하 는 것 입 니 다.
플러그 인 홈 페이지 주소:http://www.gruntjs.net/plugins
1. 프로젝트 이름 test 를 만 들 고 같은 등급 디 렉 터 리 에 Package. json 과 Gruntfile. js 를 만 듭 니 다.
Package.json

{
  "name": "test",
  "version": "1.0.0",
  "devDependencies": {
  }
}

Gruntfile.js

//    
module.exports = function(grunt) {
　　//    ，         
　　grunt.initConfig({
	//   package.json   
	pkg: grunt.file.readJSON('package.json')		
　　});
　　//  grunt        grunt       （      ）
　　grunt.registerTask('default', ['']);
}

2. 현재 디 렉 터 리 에 grunt 를 설치 합 니 다. 이때 package. json 파일 의 devDependencies 에서 플러그 인 이름과 버 전 번 호 를 포함 하 는 json 을 자동 으로 생 성 합 니 다.

npm install grunt --save-dev
npm install grunt-contrib-jshint --save-dev
npm install grunt-contrib-uglify --save-dev
npm install grunt-contrib-watch --save-dev
.....

3. Gruntfile. js 파일 에 grunt. loadnpmTasks ('플러그 인 이름') 를 추가 합 니 다.그 중에서. jshintrc 는 필터 규칙 이 므 로 스스로 작성 해 야 합 니 다.

//    
module.exports = function(grunt) {
	//    ，         
	grunt.initConfig({
	　　//   package.json   
	　　pkg: grunt.file.readJSON('package.json'),
	　　//uglify       
	　　uglify: {
	　　　　options: {
		　　stripBanners: true,
		　　banner: '/*! <%=pkg.name%>-<%=pkg.version%>.js <%= grunt.template.today("yyyy-mm-dd") %> */
' 
	　　　　},
	　　　　build: {
		　　src: 'static/js/index.js',
		　　dest: 'build/js/index-<%=pkg.version%>.js.min.js'
	　　　　}
	　　},
	　　jshint:{
	　　　　options: {
		　　jshintrc: '.jshintrc'
	　　　　},
	　　　　build: ['Gruntfile.js', 'static/js/*.js']
	　　},
	　　watch: {
	　　　　build: {
		　　files: ['static/js/*.js', 'static/css/*.css'],
		　　tasks: ['jshint', 'uglify'],
		　　options: {spawn: false}
	　　　　}
　　	　　}
　　});
　　//  grunt        
　　grunt.loadNpmTasks('grunt-contrib-uglify');
　　grunt.loadNpmTasks('grunt-contrib-jshint');
　　grunt.loadNpmTasks('grunt-contrib-watch');
　　//  grunt        grunt       （      ）
　　grunt.registerTask('default', ['jshint','uglify','watch']);
}

4. 실행

grunt 
grunt uglify
grunt watch
......