이미지 파일을 자동으로 삭제하는 기능은 Grunt의 플러그인 중 하나인 grunt-contrib-imagemin을 사용하면 간단하게 구현할 수 있습니다. 이 플러그인은 이미지 파일을 최적화하고 압축하는 기능을 제공합니다.

먼저, 프로젝트 폴더에서 Grunt를 설치해야 합니다. 명령 프롬프트 또는 터미널에서 아래의 명령어를 실행합니다.

npm install -g grunt-cli

그리고 나서, 프로젝트 폴더에서 package.json 파일을 생성하기 위해 아래의 명령어를 실행합니다.

npm init

package.json 파일이 생성된 후, Grunt와 grunt-contrib-imagemin 플러그인을 설치하기 위해 아래의 명령어를 실행합니다.

npm install grunt grunt-contrib-imagemin --save-dev

그리고 나서, 프로젝트 폴더에 Gruntfile.js 파일을 생성합니다. 이 파일은 Grunt의 설정 파일로 사용됩니다. Gruntfile.js 파일에 아래의 코드를 추가합니다.

module.exports = function(grunt) {
  grunt.initConfig({
    imagemin: {
      dynamic: {
        files: [{
          expand: true,
          cwd: 'src/images/', // 이미지 파일이 있는 폴더 경로
          src: ['**/*.{png,jpg,gif}'], // 이미지 파일 확장자
          dest: 'dist/images/' // 최적화된 이미지 파일을 저장할 폴더 경로
        }]
      }
    }
  });

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

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

위의 코드에서 cwd는 원본 이미지 파일이 위치한 폴더 경로를, src는 원하는 이미지 확장자를 설정합니다. dest는 최적화된 이미지 파일을 저장할 폴더 경로를 지정합니다.

이제, 터미널에서 아래의 명령어를 실행하여 이미지 파일을 자동으로 최적화하고 삭제합니다.

grunt

이 명령어를 실행하면 cwd에 지정한 폴더에서 src에 지정한 확장자를 가진 이미지 파일이 최적화되고, 최적화된 파일이 dest에 지정한 폴더로 저장됩니다. 이미지 파일이 이미 최적화되어 있거나 사용되지 않는 경우 해당 이미지 파일은 자동으로 삭제됩니다.

참고문서:

• Grunt 공식 웹사이트
• grunt-contrib-imagemin 공식 GitHub