demun(대문블로그)

퍼블리셔/Grunt2015. 7. 2. 07:00

grunt-concurrent grunt-concurrent 원문그런트 작업을 동시에 실행합니다.Coffee 와 Sass 같은 느린작업을 동시에 실행하면 잠재적으로 빌드시간을 크게 향상시킬수 있습니다.nodemon 과 watch 같은 다수의 작업multiple blocking tasks을 실행하고 한번에 관찰하는 경우 이 작업은 유용합니다. Install npm install --save-dev grunt-concurrent Usage require('load-grunt-tasks')(grunt); // npm install --save-dev load-grunt-tasks 과 같은 겁니다. grunt.initConfig({ concurrent: { target1: ['coffee', 'sass'], t..

퍼블리셔/Grunt2015. 7. 1. 11:11

grunt-newer grunt-newer 원문 작업중 Grunt 태스크를 가동시키려면 성공적으로 실행된 최종 파일 이후 수정된 소스파일들과 같이 실행하라 새로운 newer파일들 하고만 함께 실행되도록 Grunt 태스크를 설정하라Synopsis: newer 태스크가 또다른 태스크를 src파일(a, b)들과 함께 실행하기 위해 환경설정을 할것이다. dest 파일보다 새로운 최종 성공적으로 실행된 파일보다 새로운(dest파일이 없을 경우..) Getting Started 시작하기 이플러그인은 Grunt~0.4.1을 필요로 한다. 만일 이전에 Grunt를 사용한 경험이 없다면 gruntfile.js를 어떻게 생성하는가와 설치방법, 플러그인의 사용법등을 설명하고 있는 그런트 시작하기 가이드를 꼭 읽어보기 바란다..

퍼블리셔/Grunt2015. 6. 30. 07:00

8.최적화 newer , concurrent , time-grunt , load-grunt-tasks 좀더 쉽고, 체계적으로 작업하기 위한 최적화 과정의 예제와 방법입니다. newer newer 모듈은 변경된 파일이나 부분만을 감지하는 모듈입니다. 감시하는 모듈인 watch 에 주로 사용하며, 변경된 부분만 다시 리로드할때 주로 사용합니다.Gruntfile.js 에서 사용하는 예제는 아래와 같습니다. watch: { options: {livereload: true}, gruntfile: { files: ['Gruntfile.js'], tasks: ['newer:jshint:grunt'] }, } 설명 watch 에 사용된 예제로 Gruntfile.js 을 대상으로 jshint 작업에 grunt 작업부분을..

퍼블리셔/Grunt2015. 6. 29. 07:00

grunt-contrib-connect grunt-contrib-connect 원문connect web server를 시작 합니다. Getting Started 시작하기 이 플러그인은 Grunt~0.4.0을 필요로 한다.만일 이전에 Grunt를 사용한 경험이 없다면, Gruntfile을 어떻게 생성하는가와 설치방법, 플러그인의 사용법 등을 설명하고 있는 그런트 시작하기 가이드를 꼭 읽어보기 바란다. 그내용을 숙지했다면 아래의 명령어로 이 플러그인을 설치할 수 있을것이다. npm install grunt-contrib-connect --save-dev 플러그인이 설치되면, Gruntfile 내에서 자바스크립트의 코드로 아래의 명령을 사용할 수 있습니다 : grunt.loadNpmTasks('grunt-co..

퍼블리셔/Grunt2015. 6. 28. 07:00

grunt-contrib-watch grunt-contrib-watch 원문변경 또는 삭제, 파일 패턴이 추가 될 때마다 감시하여 미리 정의된 작업을 실행 Getting Started 시작하기 이 플러그인은 Grunt~0.4.0을 필요로 한다.만일 이전에 Grunt를 사용한 경험이 없다면, Gruntfile을 어떻게 생성하는가와 설치방법, 플러그인의 사용법 등을 설명하고 있는 그런트 시작하기 가이드를 꼭 읽어보기 바란다. 그내용을 숙지했다면 아래의 명령어로 이 플러그인을 설치할 수 있을것이다. npm install grunt-contrib-watch --save-dev 플러그인이 설치되면, Gruntfile 내에서 자바스크립트의 코드로 아래의 명령을 사용할 수 있습니다 : grunt.loadNpmTask..

퍼블리셔/Grunt2015. 6. 27. 07:00

7.watch task watch , connect 변경된 파일을 감시하여 실시간으로 동기화하고, 로컬서버로 연결하여 브라우져로 확인하는 예제와 방법입니다. watch watch 모듈은 파일을 감시해서 실시간으로 재생산하께끔 해주는 모듈입니다.Gruntfile.js 에서 사용하는 예제는 아래와 같습니다. watch: { options: {livereload: true}, gruntfile: { files: ['Gruntfile.js'], tasks: ['newer:jshint:grunt'] }, js: { files: ['app/js/**/*.js'], tasks: ['newer:jshint:dist','concat','uglify'] }, less: { files: ['app/less/**/*.less..

퍼블리셔/Grunt2015. 6. 26. 07:00

grunt-contrib-imagemin grunt-contrib-imagemin 원문이미지를 축소합니다. Getting Started 시작하기 이 플러그인은 Grunt ~0.4.0 버젼이상이 필요.Grunt 를 시작하기 전에 Grunt 시작하기를 확인해야 합니다. 이 문서는 Gruntfile 뿐만 아니라 설치하고 Grunt 플러그인을 사용합니다.이 과정에 익숙하다면, 당신은 다음 명령으로 이 플러그인을 설치할 수 있습니다: npm install grunt-contrib-imagemin --save-dev 플러그인이 설치되면, Gruntfile 내에서 자바스크립트의 코드로 아래의 명령을 사용할 수 있습니다 : grunt.loadNpmTasks('grunt-contrib-imagemin'); 이 플러그인은..

퍼블리셔/Grunt2015. 6. 25. 07:00

grunt-contrib-copy grunt-contrib-copy 원문폴더 및 파일을 복사합니다. Getting Started 시작하기 이 플러그인은 Grunt ~0.4.0 버젼이상이 필요.Grunt 를 시작하기 전에 Grunt 시작하기를 확인해야 합니다. 이 문서는 Gruntfile 뿐만 아니라 설치하고 Grunt 플러그인을 사용합니다.이 과정에 익숙하다면, 당신은 다음 명령으로 이 플러그인을 설치할 수 있습니다: npm install grunt-contrib-copy --save-dev 플러그인이 설치되면, Gruntfile 내에서 자바스크립트의 코드로 아래의 명령을 사용할 수 있습니다 : grunt.loadNpmTasks('grunt-contrib-copy'); 이 플러그인은 그런트의 0.4.x...

퍼블리셔/Grunt2015. 6. 24. 07:00

grunt-contrib-clean grunt-contrib-clean 원문폴더 및 파일을 삭제합니다. Getting Started 시작하기 이 플러그인은 Grunt ~0.4.0 버젼이상이 필요.Grunt 를 시작하기 전에 Grunt 시작하기를 확인해야 합니다. 이 문서는 Gruntfile 뿐만 아니라 설치하고 Grunt 플러그인을 사용합니다.이 과정에 익숙하다면, 당신은 다음 명령으로 이 플러그인을 설치할 수 있습니다: npm install grunt-contrib-clean --save-dev 플러그인이 설치되면, Gruntfile 내에서 자바스크립트의 코드로 아래의 명령을 사용할 수 있습니다 : grunt.loadNpmTasks('grunt-contrib-clean'); 이 플러그인은 그런트의 0...

퍼블리셔/Grunt2015. 6. 23. 07:00

6.others task clean , copy , imagemin 폴더와 파일을 복사, 삭제하고, 이미지를 최적화하는 모듈의 사용방법 및 예제입니다. clean clean 모듈은 폴더와 파일을 삭제하는 모듈입니다.작업을 할때는 대체적으로 여러번 작업을 함으로 파일을 덮어쓰지않고 삭제한후 다시 생산해서 사용합니다.Gruntfile.js 에서 사용하는 예제는 아래와 같습니다. clean: { dev: { files: [{ dot: true, src: [ 'dev/**/*', 'app/css', 'dist/**/*' ] }] }, dist: { files: [{ dot: true, src: [ 'app/css', 'dist/**/*' ] }] }, }, 설명 이 프로젝트에서는 두개의 작업으로 나눕니다.dev..