[npm] grunt를 설치하는 방법 및 스크립트를 작성하는 방법

Program / 글쓴이

안녕하세요 저는 Windows 7 64 비트에 Grunt를 설치하려고합니다. 명령을 사용하여 Grunt를 설치했습니다.

 npm install -g grunt
 npm install -g grunt-cli

하지만 지금 시도 grunt init하면 오류가 발생합니다.

유효한 Gruntfile을 찾을 수 없습니다. grunt를 구성하는 방법에 대한 자세한 내용은 시작 안내서를 참조하십시오.
http://gruntjs.com/getting-started 치명적인 오류 : Gruntfile을 찾을 수 없습니다.

하지만 내 시스템의 grunt 폴더를 살펴보면 Gruntfile.js거기에 있습니다. 누군가이 grunt를 올바르게 설치하는 방법과 grunt를 사용하여 빌드 된 스크립트를 작성하는 방법을 안내해 주시겠습니까? Grunt를 사용하여 스크립트를 작성하려면 HTML 페이지와 Java 스크립트가 하나 있습니다. 어떻게 할 수 있습니까?

답변

GruntJS 빌드를 설정하는 단계는 다음과 같습니다.

  1. 설정했는지 확인 package.json하거나 새로 설정했는지 확인하세요 .

    npm init

  2. Grunt CLI를 전역으로 설치합니다.

    npm install -g grunt-cli

  3. 로컬 프로젝트에 Grunt를 설치합니다.

    npm install grunt --save-dev

  4. 빌드 프로세스에 필요한 Grunt 모듈을 설치하십시오. 이 샘플을 위해 파일을 결합하기위한 Concat 모듈을 추가합니다.

    npm install grunt-contrib-concat --save-dev

  5. 이제 Gruntfile.js빌드 프로세스를 설명하는 설정을해야합니다 . 이 샘플 난 그냥 두 JS 파일을 결합 file1.js하고 file2.js에서 js폴더 생성 app.js:

    module.exports = function(grunt) {

    // Project configuration.
    grunt.initConfig({
        concat: {
            "options": { "separator": ";" },
            "build": {
                "src": ["js/file1.js", "js/file2.js"],
                "dest": "js/app.js"
            }
        }
    });

    // Load required modules
    grunt.loadNpmTasks('grunt-contrib-concat');

    // Task definitions
    grunt.registerTask('default', ['concat']);
};

  6. 이제 다음 명령으로 빌드 프로세스를 실행할 준비가되었습니다.

    grunt

이것이 GruntJS 빌드로 작업하는 방법에 대한 아이디어를 제공하기를 바랍니다.

노트:

5 단계의 원시 코딩 대신 마법사 기반 생성을 원하는 경우 grunt-init생성에 사용할 수 있습니다 Gruntfile.js.

이렇게하려면 다음 단계를 따르십시오.

npm install -g grunt-init
git clone https://github.com/gruntjs/grunt-init-gruntfile.git ~/.grunt-init/gruntfile
grunt-init gruntfile

Windows 사용자의 경우 : 당신은 cmd.exe를를 사용하는 경우는 변경해야 ~/.grunt-init/gruntfile하는 %USERPROFILE%\.grunt-init\. PowerShell은 ~올바르게 인식 합니다.

답변

WINDOWS에 대한 PATH 변수를 설정해야 할 때가 있습니다.

% USERPROFILE % \ AppData \ Roaming \ npm

그 테스트 후 where grunt

참고 : 명령 프롬프트 창을 닫았다가 다시 여는 것을 잊지 마십시오.

답변

같은 문제가 발생했지만 Grunt.js를 Gruntfile.js로 변경하여 해결했습니다. Windows cmd에 grunt.cmd를 입력하기 전에 파일 이름을 확인하십시오 (Windows를 사용하는 경우).

답변

grunt-cli를 프로젝트의 devDependencies에 설치 한 다음 package.json의 스크립트를 통해 실행해야합니다. 이런 식으로 프로젝트에서 작업하는 다른 개발자는 모두 동일한 버전의 grunt를 사용하고 설정의 일부로 전역 적으로 설치할 필요가 없습니다.

를 npm i -D grunt-cli사용하여 전역 적으로 설치하는 대신를 사용하여 grunt-cli를 설치합니다 -g.

//package.json

...

"scripts": {
  "build": "grunt"
}

그런 다음 npm run build그런트를 발사 하는 데 사용하십시오 .

답변