hello gulp,gulp 사용 첫날.

어제 하루 걸 려 서 gulp 공부 도 하고 오늘 정리 도 하고 친구 들 한테 도 나 눠 줬 어 요.우선 gulp 홈 페이지 를 한 바퀴 돌 았 습 니 다.http://gulpjs.com/ 중국어 사이트 주소:http://www.gulpjs.com.cn/ 안에 입문 안내 가 있 습 니 다.다음 과 같 습 니 다.1.전역 에 gulp 를 설치 합 니 다.

$npm install --global gulp

2.프로젝트 루트 디 렉 터 리 에 package.json 파일 을 만 들 면 수 동 으로 만 들 수도 있 고 이 명령 으로 자동화 할 수도 있 습 니 다.

$ cd 
$ npm init

3.프로젝트 개발 의존(devDependencies)설치:

$ npm install --save-dev gulp

4.프로젝트 루트 디 렉 터 리 아래 에 gulpfile.js 라 는 파일 을 만 듭 니 다.

var gulp = require('gulp');
gulp.task('default', function() {
　　//              
　　console.log("hello gulp!");
});

5.gulp 실행:

$ gulp

그러나 주의해 야 할 세부 사항 이 있 습 니 다.1.windows 환경 에서 명령 을 내리 면 당연히 그$기 호 를 추가 하지 마 세 요.2.인터넷 에 npm install–global gulp-cli 라 는 전체적인 설치 방법 이 있 습 니 다.그러면 gulp 와 gulp-cli 는 어떤 차이 가 있 습 니까?답 은 여기에 있다.http://stackoverflow.com/questions/35571679/what-does-gulp-cli-stands-for
3.왜 전역 에 gulp 를 설치 하고 로 컬 프로젝트 에 gulp 를 설치 해 야 합 니까?버 전 관리 가 편리 하기 때 문 입 니 다.서로 다른 항목 은 서로 영향 을 주지 않 고 서로 다른 버 전의 gulp 를 사용 할 수 있 습 니 다.바로 이 겁 니 다.잠깐 만,잠깐 만,여기까지 쉽게 온 나 는 아직도 한 가지 일 을 모 르 겠 어.우리 가 왜 gulp 를 써 야 하 는 지.왜 grunt 가 아니 라 gulp 야?비슷 한 기능 을 가 진 웹 팩 도 있 습 니 다.왜 gulp 입 니까?그래서 나 는 이런 것들 을 알 아 냈 다.왜 gulp 가 grunt 가 아 닌 지:http://slides.com/contra/gulp#/ gulp 와 webpack 은 또 어떤 관계 입 니까?https://www.zhihu.com/question/37020798(알 아 주 셔 서 감사합니다.)관심 사가 아니라면 왜 gulp 나 grunt 를 사용 하 느 냐 고 묻 고 싶 을 수도 있 습 니 다.grunt 중국어 망 을 빌려 쓰 는 말:자동화.반복 되 는 작업,예 를 들 어 압축(minification),컴 파일,유닛 테스트,linting 등 자동화 도 구 는 당신 의 노동 을 줄 이 고 업 무 를 간소화 할 수 있 습 니 다.자,이렇게 많은 것 을 해결 한 후에 우 리 는 계속 gulp 의 학습 여행 을 할 것 입 니 다.바로 방금,우 리 는 이미 gulp 를 장 착 했 습 니 다.그러면 우 리 는 다음 에 우리 의 일 을 시작 합 시다.만약 에 우리 가 js 파일 을 압축 해 야 한다 면 우 리 는 가장 원시 적 인 방식 으로 코드 를 압축 도구 에 복사 한 다음 에 도 구 를 압축 시 키 고 우 리 는 다시 복사 해서 우리 의 프로젝트 에 넣 을 수 있다.만약 에 gulp 를 사용한다 면 우 리 는 이렇게 귀 찮 게 하지 않 아 도 됩 니 다.우 리 는 이 몇 가지 일 을 해 야 합 니 다.1.gulp 를 설치 한 js 압축 플러그 인 npm install–save-dev gulp uglify(여러분 은 알 고 계 시 겠 죠?–save-dev 는 이 플러그 인의 설치 정 보 를 우리 의 package.json 파일 에 기록 한 다 는 뜻)2.gulpfile.js 에서 작업 을 설정 합 니 다.

var gulp = require('gulp'),
    uglify = require('gulp-uglify');
gulp.task('compile-js',function(){
    return gulp.src(<     js    >)
    .pipe(uglify())
    .pipe(gulp.dest(<         >));
});

다 쓴 후에 gulp copile-js 를 실행 하 는 것 은 간단 하지 않 습 니까?하하.너 는 아마 이것 이 그렇게 간단 하지 않다 고 생각 할 것 이다.코드 도 써 야 하 니 정말 번거롭다.그것 은 당신 이 한 파일 만 압축 했 기 때 문 입 니 다.10 개 이상 의 파일 을 압축 하 라 고 하면 압축 도구 에서 복사 하고 복사 하 는 것 이 잘못 되 겠 죠?하지만 gulp 를 사용 하면 작업량 이 조금도 증가 하지 않 았 습 니 다.이 작은 코드 로 해결 할 수 있 습 니 다.마찬가지 로 css,html 의 압축,sas 의 번역 은 모두 여기에서 완성 할 수 있 습 니 다.예전 에 여러 개의 도구 소프트웨어 로 자 르 는 것 보다 편리 한 것 은 조금도 아 닙 니 다.당연 하지,이 안에 작은 구덩이 가 있어.먼저 gulp 의 api 를 배 워 야 합 니 다.그렇지 않 으 면 작업 을 어떻게 만 드 는 지,원본 파일 과 목표 파일 을 어떻게 만 드 는 지 어떻게 압 니까?　　http://www.gulpjs.com.cn/docs/api/ 이 작은 밤 은 끝 입 니 다.그런데 자주 사용 하 는 기능 도 있 습 니 다.자주 사용 하 는 플러그 인 에 대응 하여 소개 합 니 다.http://www.cnblogs.com/2050/p/4198792.html 위의 이 글 의 네 번 째 부분 은 플러그 인 부분 을 잘 말 합 니 다.
그 다음 에 워 치 와 changed 같은 작은 기술 들 이 있 습 니 다.http://www.tuicool.com/articles/2miAvyu 위의 이 글 은 구덩이 문 으로 친구 들 의 공유 에 감 사 드 립 니 다.또 하나의 팁 이 있 습 니 다.그것 은 바로 어떤 플러그 인 을 어떻게 삭제 하 는 것 입 니까?예 를 들 어 당신 의 어떤 플러그 인 이 잘못 설치 되 었 거나 필요 하지 않 습 니 다.당신 은 이렇게:npm uninstall–save 예 를 들 어 우리 가 방금 한 gulp-uglify npm uninstall–save gulp-uglify 는 네티즌 들 의 사심 없 는 공유 에 감 사 드 립 니 다!