Looking for gruntjs Answers? Try Ask4KnowledgeBase
Looking for gruntjs Keywords? Try Ask4Keywords

gruntjsgruntjs 시작하기


비고

이 섹션에서는 gruntj가 무엇인지, 왜 개발자가 그것을 사용하고 싶어하는지에 대한 개요를 제공합니다.

또한 gruntjs 내의 큰 주제를 언급하고 관련 주제에 링크해야합니다. gruntjs에 대한 문서는 새로운 내용이므로 관련 주제의 초기 버전을 만들어야 할 수도 있습니다.

버전

번역 출시일
0.3.0 2012-07-30
0.4.0 2013-02-17
0.4.1 2013-03-12
0.4.2 2013-11-20
0.4.3 2014-03-06
0.4.4 2014-03-13
0.4.5 2014-05-11
1.0.0 2016-04-04
1.0.1 2016-04-05

도움

grunt -h를 실행하면 다음을 볼 수 있습니다.

  • 명령 줄 매개 변수
  • 현재 디렉토리의 Gruntfile에서 사용 가능한 모든 독립형 작업
  • 현재 디렉토리의 Gruntfile에있는 각 작업 모음의 모든 하위 작업

그루트 설치

전제 조건

Grunt를 사용하려면 Node.js와 npm을 설치해야합니다. 컴퓨터에 Node.js 및 / 또는 npm이 설치되어 있지 않은 경우 https://nodejs.org 로 이동하여 운영 체제의 설치 프로그램이나 패키지를 다운로드하십시오.

최초 설치

Grunt를 처음 설치하는 경우 먼저 Grunt 명령 줄 인터페이스 패키지 인 grunt-cli 를 설치해야합니다.

npm install -g grunt-cli

Grunt에 대한 명령 줄 인터페이스가 전역으로 설치되므로 프로젝트에서 Grunt의 로컬 버전을 실행할 수 있습니다.

다음 명령을 실행하여 grunt-cli 패키지가 설치되었는지 확인할 수 있습니다.

grunt --version
 

이렇게하면 grunt-cli 패키지의 현재 버전이 인쇄됩니다.

프로젝트에 그르 른 설치하기

grunt-cli 설치하고 실행 한 후에는 실제 grunt 작업 러너와 grunt-contrib-jshint 패키지 grunt-contrib-jshint .

npm install grunt --save-dev
npm install grunt-contrib-jshint --save-dev

이렇게하면 NPM 패키지 관리자에서 패키지를 다운로드하여 devDependenciespackage.json 파일에 저장합니다.

그룬트 파일

다음으로 Grunt 작업을위한 설정 파일의 역할을하는 프로젝트 루트에 Gruntfile.js 가 필요합니다 :

module.exports = function(grunt) {

    grunt.initConfig({
        jshint: {
            files: ['Gruntfile.js'],
        }
    });

    grunt.loadNpmTasks('grunt-contrib-jshint');


    grunt.registerTask('default', ['jshint']);
};

이 파일은 다음 세 가지 작업을 수행합니다.

  1. Grunt가 NPM 패키지에서 grunt-contrib-jshint 태스크를로드하도록 지시합니다.
  2. 그것은 조언을 jshint 파일에 대해 실행하는 작업 Gruntfile.js
  3. jshint 작업을 실행하는 default 라는 Grunt 작업을 만듭니다.

달리기 그랑트

프로젝트를 설정 한 후에 다음과 같이 Grunt의 default 작업을 실행할 수 있습니다.

grunt

이것은 jshint 라는 작업을 실행하도록 구성된 default 라는 grunt 작업을 찾는 로컬 grunt 를 실행하는 grunt-cli 를 시작합니다.

실행중인 작업

구성의 작업

grunt.initConfig 모든 속성은 유효한 작업이므로 Gruntfile이 다음과 같이 보이는 경우 :

module.exports = function(grunt) {

    grunt.initConfig({
        jshint: {
            files: ['Gruntfile.js'],
        }
    });

    grunt.loadNpmTasks('grunt-contrib-jshint');


    grunt.registerTask('default', ['jshint']);
};
 

셸 명령 $ grunt jshintjshint 작업을 실행합니다.

대상이있는 작업

태스크는 다른 대상을 가질 수 있습니다. 이 스 니펫 코드를 예로 들어 보겠습니다.

    grunt.initConfig({
        jshint: {
            gruntfile: {
                files: ['Gruntfile.js']
            },
            project: {
                files: 'src/**/*.js'
            }
        }
    });
 

여기에서 jshint는 프로젝트의 gruntfile 또는 모든 JavaScript 파일을 대상으로 할 수 있습니다. $ grunt jshint 실행하면 두 대상이 모두 사용되지만 $ grunt jshint:gruntfile 실행하면 linter가 $ grunt jshint:gruntfile 에만 적용됩니다.

등록 된 작업

grunt.registerTask('default', ['jshint']); 와 같이 등록 된 기본 작업 grunt.registerTask('default', ['jshint']); $ grunt 쉘 명령으로 실행됩니다.

새로 등록 된 작업은 명령 줄 인수로 이름을 전달하여 실행됩니다. 예 :

grunt.registerTask('gruntfile', ['jshint:gruntfile']);
 

$ grunt gruntfile 런트가됩니다.