Node.js 모듈 개발—Gruntfile.js 상세 설명

1. grunt 모듈 소개

grunt 플러그인은 npm 환경의 자동화 도구입니다. 압축, 컴파일, 단위 테스트, 린트 등과 같이 반복적으로 반복해야 하는 작업의 경우 자동화된 도구를 사용하면 노동력을 줄이고 작업을 단순화할 수 있습니다. grunt 모듈은 Gruntfile.js 파일의 구성을 기반으로 작업을 수행합니다.
다음 명령이 package.json에 정의되어 있는 경우:

[관련 과정 권장 사항: JavaScript 비디오 튜토리얼]

"scripts": {
    "build": "npm install && grunt"
}

npm run build를 실행하면 먼저 devDependency에 정의된 일부 모듈이 설치되므로 npm run build를 실행하세요. 이 명령은 다음 작업과 동일합니다.

● npm install grunt-cli -g

● npm install

● grunt

2. gruntfile.js의 구조:

● "래퍼" 기능

● 프로젝트 및 작업 구성

● 그런트 플러그인 및 작업 로드

● 사용자 정의 작업

3. "래퍼" 기능

모든 Gruntfile.js(및 grunt 플러그인)는 동일한 형식인 Grunt를 따릅니다. 코드는 다음 함수 내에 배치되어야 합니다.

module.exports = function(grunt){
         //do grunt-related things in here
}

4. 프로젝트 및 작업 구성

대부분의 Grunt 작업은 grunt.initConfig 메서드를 통해 Grunt 작업의 매개변수를 구성합니다.
grunt.initConfig 메소드의 매개변수는 JSON 객체입니다. 이 구성 객체에는 모든 데이터를 저장할 수 있습니다. 또한 이는 JavaScript이므로 여기에서 유효한 JS 코드를 사용할 수 있습니다. <% %> 템플릿 문자열을 사용하여 구성된 속성을 참조할 수도 있습니다. 예:

// 项目和任务配置
grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'), //获取 package.json 中的元数据(js代码)
  proj:{
    name:'hello',
    description:'a hello demo'
  },
  hello: {
    options: {
      name: '<%= proj.name %>'  //用<% %>模板字符串匹配hello
    },
    srcs: ['1.txt', '2.txt']
  }
});

grunt.initConfig 메소드에 구성된 속성은 작업 모듈의 grunt.config 메소드로 액세스할 수 있습니다. ：

grunt.config("proj.name");

또한 grunt 작업 모듈은 작업 이름을 기반으로 구성 개체에서 작업 이름에 해당하는 속성을 자동으로 추출합니다. 예를 들어 작업 hello를 정의할 때 작업 실행 기능에 필요한 속성을 구성합니다. 구성 객체에 해당하는 "hello" 속성.

5. 그런트 플러그인 작업 로드

작업 중복을 줄이기 위해 기존 플러그인 작업을 로드할 수 있습니다.

1. 나만의 개인 grunt 플러그인 로드

자신이 정의한 작업 스크립트 중 일부를 동일한 디렉터리에 배치하고 grunt.loadTasks 메서드를 통해 지정된 디렉터리에서 해당 디렉터리의 모든 grunt 작업 스크립트를 로드할 수 있습니다. .

2. npm에 게시된 grunt 플러그인 로드

grunt-contrib-copy 및 grunt-contrib-uglify와 같은 일반적인 작업은 grunt 플러그인 형태로 개발되었으며 npm에 게시되어 있습니다. 라이브러리에서 사용할 플러그인이 package.json 파일의 종속성에 나열되어 있고 npm install을 통해 설치되어 있으면 작업을 직접 로드할 수 있습니다.

// 加载能够提供"copy"任务的插件。
grunt.loadNpmTasks('grunt-contrib-copy');

3 "grunt-"로 시작하는 모든 플러그인을 직접 로드합니다.

npm에는 "grunt-"로 시작하는 모든 플러그인을 로드하는 데 사용할 수 있는 load-grunt-tasks 플러그인이 있습니다. 종속성 목록에 있습니다.
종속성에서 "grunt-"로 시작하여 사용해야 하는 플러그인을 나열한 다음 Gruntfile.js에서 호출하세요.

//Load grunt tasks from NPM packages
load-grunt-tasks

6. 사용자 정의 작업

1. 작업의 동작을 직접 정의합니다

grunt.registerTask('hello', 'Show some msg', function() {
  console.log(this.options().name); //输出hello
});

2. 작업 목록으로 정의합니다

작업을 일련의 작업의 조합으로 정의할 수 있습니다. . 이 일련의 작업은 순서대로 실행됩니다.

grunt.registerTask('dothings', 'copy and Show some msg', ['copy','hello']);

3. 기본 작업 정의

기본 작업을 정의하면 Grunt가 기본적으로 하나 이상의 작업을 실행하도록 할 수 있습니다. grunt 명령 실행 시 작업을 지정하지 않으면 기본 작업이 실행됩니다. 아래에 정의된 경우 grunt 실행은 grunt hello 실행과 동일합니다.

grunt.registerTask('default', ['hello']);

4. 복합 작업 정의

registerMultiTask 메소드는 복합 작업을 정의할 수 있습니다. 복합 작업은 grunt.initConfig 메소드에 구성된 해당 속성의 옵션을 제외하고 정의된 속성을 차례로 target:data 쌍으로 처리합니다.

module.exports = function(grunt) {
    grunt.initConfig({
        Log: {
            options: {
                sep: ';'
            },
            srcs: ['1.txt', '2.txt'],
            dests: ['d1.txt', 'd2.txt']
        }
    });
    grunt.registerMultiTask("Log", function() {
        var options = this.options({ sep: '&' });
        console.log(this.target); 
        console.log(this.data.join(options.sep));
    });
};

grunt Log를 실행하면 다음이 출력됩니다:

Running "Log:srcs" (Log) task
srcs
1.txt;2.txt
Running "Log:dests" (Log) task
dests
d1.txt;d2.txt

定义任务行为Tips

1.任务内部可以执行其他的任务。

grunt.registerTask('mytask', function() {
  grunt.task.run('task1', 'task2');
  // Or:
  grunt.task.run(['task1', 'task2']);
});

2.定义异步任务

grunt.registerTask('mytask', function() {
  var done = this.async();
  //do something
  done();
});

3.当任务失败时，所有后续任务都将终止

在任务中，当执行失败，可以return false来表明当前任务执行失败，一般，多个任务按顺序执行，如果有任务失败时，所有后续任务都将终止。可以通过在命令行后加上--force来使有任务失败时，后续任务能继续进行。

4.任务中检查前置任务状态

有些任务可以依赖于其他任务的成功执行。通过grunt.task.requires方法来检查其前置任务是否已经执行，并且没有失败。

5.任务中检查配置属性

可以用方法grunt.task.requiresConfig指定一个或者多个字符串或者数组的配置属性为必需的。如果一个或多个必需的配置属性缺失，就通知系统当前任务失败。

本文来自 js教程 栏目，欢迎学习！  

위 내용은 Node.js 모듈 개발—Gruntfile.js 상세 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!