demun(대문블로그)

퍼블리셔/Grunt2014. 12. 26. 17:43

1.그런트(Grunt) 작업환경 구성하기 그런트 작업환경 구성하기 는 사이트를 제작하는데 있어 반복되는 작업들(폴더 만들고, 재사용 해야하는 코드들 포함하고, 플러그인들 즉 javascript, css 등등을 포함해야하고 이러한 일련의 과정)을 매번 만들고 구성해야 하는데, 이러한 일련의 과정을 줄이고, 자동화해서 작업효율을 높이고 제작 및 배포를 손쉽게하기 위함입니다. 즉 이 모든것을 한번에 간단하게 구축하는것을 말합니다.또한 어느 사이트나 적용할 수 있도록 탄력적으로 구성하는 것이 목표가 되겠습니다. 설치되어 있어야 할 환경 Grunt 를 사용하려면 우선 node.js 를 설치해야 하고, git 을 설치해야 합니다.또 콘솔창을 열어 아래의 코드를 입력해서 그런트를 사용할 수 있도록 합니다. npm i..

퍼블리셔/Grunt2014. 12. 26. 17:41

css task css 를 사용하기 위해 많이 사용하는 전처리 언어는 less , sass 를 사용한다. stylus 도 있긴한데 사용율은 위의 두개보다 떨어지는듯하다. css 의 제작과정을 살펴보면, less 를 사용해서 제작하고, autoprefixer 태스크를 사용해서 밴더 프리픽스를 붙이고, csscomb 를 통해서 속성정리를 한다음 csslint 태스크를 사용해서 구문오류를 잡고, cssmin 태스크를 통해서 압축을 진행한다. css 를 만드는데 있어 less, autoprefixer , csslint , cssmin 등 총 4개의 태스크를 사용한다. 이글에서는 이 4개의 모듈의 사용법을 알아본다. 여기서는 일단 less 에 대해서 다루고 차후에 sass 모듈에 대해서 다뤄봅니다. 그런트에서 l..