gulp.js - javascript 삽질중

이 회사의 좋은점은 

ES6에 관련한 개발도구와 환경이 다 갖춰있다는것이다.

근데 프로젝트마다 다 다른 도구와 환경이라는게 단점이다.

 

프로젝트 마다 gulp, grunt, webpack 다양한 빌드툴로 설정되어있다.

각각 공부하고 경험하기 참 좋다.

근데 그렇게 설정한 사람들 중 남아있는 사람이 없어서

내가 와서 하나하나 배워야 운영이 가능하다.

 

배워야하는이 많다는 장점과 단점이 존재한다.

뭔가 수정하려면 시간이 많이 걸리는건 완벽한 단점.

 

개발, 운영환경을 통일화 하는 숙제가 나에겐 있다.

 

오늘 훑어볼건 gulp.js 

자바스크립트를 자동빌드 해주는 툴이다.

꼭 ES6가 아니여도 되는거 같다. ES6를 빌드하려면 babel도 dependency로 설치해야한다.

 

gulpfile.js라고 설정파일이 있는데, 이 파일을 다행히 처음부터 작성할 필요는 없다.

github 같은데서 구할 수 있을거다.

파일내 구성은 아래와 같다.

gulp.task	작업모듈 단위
gulp.src	읽을 파일들 위치 설정(*표현식 가능)
gulp.desc	저장할 위치 설정
gulp.watch	바라보고 있다가 변경시 자동 재시작할 파일 위치 설정(*표현식 가능)

플러그인이 몇천개나 된다한다....

 

그냥 gulp 치면 gulpfile.js를 읽는데 default 테스크를 시작점으로 읽는다.

 

회사에 gulpfile중에 설정된 플러그인이 많이 셋팅된걸 슬쩍보니

path = require('path'),
	gulp = require('gulp'),
	concat = require('gulp-concat'),
	uglify = require('gulp-uglify-es').default,
	cssmin = require('gulp-cssmin'),
	rename = require('gulp-rename'),
	autoprefixer = require('gulp-autoprefixer'),
	notify = require('gulp-notify'),
	plumber = require('gulp-plumber'),
	handlebars = require('gulp-handlebars'),
	wrap = require('gulp-wrap'),
	decl = require('gulp-declare'),
	concat = require('gulp-concat'),
    ..
    
    

 

결론적으로는 플러그인 공부를 해야하는거 같다. 

그중 'gulp-uglify'. 스크립트를 압축해서 쬐만하게 만드는것부터 보길

 

 

참고사이트

https://velopert.com/1344

https://programmingsummaries.tistory.com/377