1. Grunt 설치: npm을 사용하여 Grunt를 전역으로 설치합니다.

   npm install -g grunt-cli
   

2. Gruntfile.js 작성: 프로젝트 루트에 Gruntfile.js 파일을 생성하고 원하는 설정을 작성합니다.

3. Grunt 플러그인 설치: 필요한 번들링 작업을 위한 Grunt 플러그인을 설치합니다. 예를 들어, grunt-contrib-concat 플러그인을 사용하여 파일을 연결합니다.

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

4. Grunt 설정: Gruntfile.js 내에서 플러그인을 로드하고 설정을 작성합니다.

   module.exports = function(grunt) {
     grunt.initConfig({
       concat: {
         options: {
           separator: ';',
         },
         dist: {
           src: ['src/js/*.js'],
           dest: 'dist/js/bundle.js',
         },
       },
     });
   
     grunt.loadNpmTasks('grunt-contrib-concat');
   
     grunt.registerTask('default', ['concat']);
   };
   

5. 번들링 실행: 콘솔에서 grunt 명령어를 실행하여 번들링 작업을 수행합니다.

   grunt
   

이제 src/js 디렉토리의 모든 JavaScript 파일이 dist/js/bundle.js로 번들링됩니다. 필요한 플러그인을 설치하고 Gruntfile.js를 설정하여 원하는 환경에 맞게 프로젝트를 번들링할 수 있습니다.

참고 자료:

• Grunt 공식 문서
• Grunt 플러그인 목록