10. module.exports = function(grunt) {
// project에 대한 설정 (grunt task, package 설정 등)
grunt.config.init({
// project의 meta data(name, version 등)를 읽는다.
pkg: grunt.file.readJSON('package.json')
});
};
11. $ npm install grunt-contrib-uglify --save-dev
* js를 uglify(compress, 압축) 하는 grunt task를
제공하는 플러그인
12. module.exports = function(grunt) {
// project에 대한 설정 (grunt task, package 설정 등)
grunt.config.init({
// project의 meta data(name, version 등)를 읽는다.
pkg: grunt.file.readJSON('package.json'),
uglify: {
options: {
// 결과(dest) 파일에 지정한 배너를 삽입한다. (상단의 주석이라 생각하면 된다)
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */n'
},
build: {
// template을 통해 pkg의 정보를 활용할 수 있다.
src: 'src/<%= pkg.name %>.js',
dest: 'build/<%= pkg.name %>.min.js'
}
}
});
// uglify task를 지원하는 플러그인을 불러온다.
grunt.loadNpmTasks('grunt-contrib-uglify');
// grunt.config.init에서 설정한 uglify task를 기본 task로 등록한다.
grunt.registerTask('default', ['uglify']);
};
13. $ grunt
*grunt [task]로 grunt를 실행시킨다. task를 따로
지정하지 않으면 default로 등록된 task가 실행된다.
14. /*! rainist-grunt 2014-12-12 */
var a=10,b=20,c=a+b;console.log(a+b+c);
rainist-grunt/build/rainist-grunt.min.js
15. $ npm install grunt-contrib-concat --save-dev
* 여러 js 파일들을 모두 하나로 모아주는 grunt task
를 제공하는 플러그인
16. module.exports = function(grunt) {
// project에 대한 설정 (grunt task, package 설정 등)
grunt.config.init({
// project의 meta data(name, version 등)를 읽는다.
pkg: grunt.file.readJSON('package.json'),
concat: {
options: {
separator: ';'
},
dist: {
src: ['src/tttt.js', 'src/tttt2.js'],
dest: 'build/<%= pkg.name %>.js'
}
},
uglify: {
options: {
// 결과(dest) 파일에 지정한 배너를 삽입한다. (상단의 주석이라 생각하면 된다)
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */n'
},
build: {
// template을 통해 pkg의 정보를 활용할 수 있다.
src: '<%= concat.dist.dest %>',
dest: 'build/<%= pkg.name %>.min.js'
}
}
});
// uglify task를 지원하는 플러그인을 불러온다.
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
// grunt.config.init에서 설정한 uglify task를 기본 task로 등록한다.
grunt.registerTask('default', ['concat', 'uglify']);
};
17. $ npm install grunt-contrib-watch --save-dev
* 원하는 파일이 변경 되었을 때, 등록된 task를 자
동으로 실행시키는 task를 제공하는 플러그인
18. module.exports = function(grunt) {
// project에 대한 설정 (grunt task, package 설정 등)
grunt.config.init({
// project의 meta data(name, version 등)를 읽는다.
pkg: grunt.file.readJSON('package.json'),
concat: {
options: {
separator: ';'
},
dist: {
src: ['src/*.js'],
dest: 'build/<%= pkg.name %>.js'
}
},
uglify: {
options: {
// 결과(dest) 파일에 지정한 배너를 삽입한다. (상단의 주석이라 생각하면 된다)
banner: '/*! <%= pkg.name %> <%= grunt.template.today("yyyy-mm-dd") %> */n'
},
build: {
// template을 통해 pkg의 정보를 활용할 수 있다.
src: '<%= concat.dist.dest %>',
dest: 'build/<%= pkg.name %>.min.js'
}
},
watch: {
files: ['<%= concat.dist.src %>'],
tasks: ['concat', 'uglify']
}
});
// uglify task를 지원하는 플러그인을 불러온다.
grunt.loadNpmTasks('grunt-contrib-uglify');
grunt.loadNpmTasks('grunt-contrib-concat');
grunt.loadNpmTasks('grunt-contrib-watch');
// grunt.config.init에서 설정한 uglify task를 기본 task로 등록한다.
grunt.registerTask('default', ['watch']);
};
19. $ npm install grunt-contrib-jshint --save-dev
* js 코드 품질 관리를 도와주는 js hint를 실행시키
는 task를 제공하는 플러그인
28. $ npm install grunt-contrib-imagemin —-save-dev
$ npm install grunt-imageoptim --save-dev
* 두 플러그인 모두 이미지 사이즈를 줄여주는 task를 제공한다.
imageoptim의 경우 OS X만 지원한다(Mac의 앱에 의존하기 때문이
다). 둘의 비교는 http://goo.gl/jSX92Z를 참고하면 된다.