내가 Grunt.js에 대해 좋아하는 것

GruntJS은 일련의 작업을 워크플로에 결합할 수 있는 JavaScript 작업 실행기입니다. 이것은 일반적으로 프로젝트의 빌드 프로세스와 연관되지만 실제로는 모든 지원 프로세스에도 사용할 수 있습니다.

프로젝트 초기화(npm 종속성이 설치된 후)

Github의 프로덕션 브랜치에 릴리스 게시

특정 방식으로 포맷된 파일을 다른 포맷으로 변환합니다.

package.json의 버전 번호 증가

캐시된 파일의 빌드 디렉토리 정리

어느 시점에서 나는 Stack Overflow에서 GruntJS 질문에 가장 많이 기여한 사람 중 한 명임을 알게 되었습니다. 요즘에는 매일 코딩을 하는 사람들이 Grunt에 대해 많이 이야기하는 것을 듣지 못하지만 여전히 청중이 있다는 것을 알고 있습니다. Grunt에 대한 모든 경험을 바탕으로 이 도구에 대해 제가 좋아하는 점은 다음과 같습니다.

내가 사랑한 것

자바스크립트로 작성

저는 직업상 풀스택 JavaScript 엔지니어입니다. 저의 가장 강력한 역량을 사용하는 툴링을 통해 Grunt API에 익숙해지고 항상 일반적으로 알려지지 않은 방식으로 확장할 수 있었습니다.

내 그런 파일

인터넷에서 찾을 수 있는 대부분의 gruntfile 예제와 달리 광산은 모듈식이므로 루트 파일 자체가 미니멀하고 읽기 쉽습니다. 플러그인 및 구성은 동적으로 로드되는 반면 작업은 파일 하단에 정의됩니다. 나는 이것들을 동적으로 로딩하면서 놀았지만 gruntfile에서 명확하게 정의되는 사용 가능한 작업의 매니페스트를 선택했습니다.

이것이 프로젝트에서 어떻게 보이는지:

grunt/configs/
  - jslint.js
  - less.js
  - minify.js
grunt/tasks/
  - import-batch.js
  - build-native-project.js
  - s3-import-avatars.js
gruntfile.js

그리고 gruntfile 자체:

module.exports = function (grunt) {
    function loadConfig(pattern) {
        var config = {},
            fileName,
            fileData;

        grunt.file.expand(pattern).forEach(function(filePath) {
            fileName = filePath.split('/').pop().split('.')[0];
            fileData = grunt.file.readJSON(filepath);
            config[fileName] = fileData[fileName];
        });

        return config;
    }

    function init() {
        var config = {
            pkg: grunt.file.readJSON('package.json')
        };

        require('load-grunt-tasks')(grunt);

        if (grunt.file.exists('grunt/tasks')) {
            grunt.log.writeln('task directory found, loading tasks...');
            grunt.loadTasks('grunt/tasks');
        }

        grunt.util._.extend(config, loadConfig('grunt/configs/**/*.js'));

        grunt.initConfig(config);
    }
    init();
};

사용 가능한 플러그인

어느 시점에는 GruntJS 주변에 적당한 크기의 커뮤니티가 있었고 워크플로우를 자동화하는 데 필요한 거의 모든 플러그인을 찾을 수 있었습니다. 린팅, 스키마 유효성 검사, 축소, 컴파일 또는 API 호출 등 작업을 제공하는 플러그인이 있을 수 있습니다.

나만의 작업 작성

특정 작업에 대한 플러그인을 찾을 수 없습니까? 괜찮아요! Grunt의 문서는 프레임워크를 사용하여 자신의 작업을 작성할 수 있는 기반을 제공합니다.

이것은 수년에 걸쳐 다양한 프로세스에 유용했으며 Grunt CLI를 통해 강력한 피드백을 제공함으로써 한 단계 더 발전했습니다. 내가 작성한 작업의 몇 가지 예:

grunt 플러그인이 없는 npm 종속성에 대한 래퍼

특정 열을 채워야 하는 Excel 스프레드시트의 유효성 검사기

비용이 많이 드는 작업 과정을 실행하기 전에 설정을 확인하라는 메시지가 나타납니다.

결합된 모든 이전 단계에서 치명적이지 않은 피드백을 자세히 설명하는 최종 보고서입니다.

동적 구성 및 워크플로우

복잡한 워크플로를 구축하면서 "1단계에서 워크플로의 나중 단계에 대한 구성을 제공할 수 있습니까?"라는 질문에 직면하기 시작했습니다.

그 대답은 예입니다! 나는 배치 프로세스를 대기열에 추가하기 위해 이것을 가장 자주 사용했습니다. 여기서 가져오기 작업은 가져오기 파일을 구문 분석하고 개별 프로세스에 대한 배치의 각 항목을 대기열에 추가할 때 리소스의 유효성을 검사합니다.

정적 구성 문서에서 문자열 템플릿을 사용할 수도 있으며 구성은 필요한 구성이 작업을 실행하는 데 사용될 때 다른 변수를 참조합니다.