twolfson / grunt-spritesmith

Grunt task for converting a set of images into a spritesheet and corresponding CSS variables
MIT License
1.14k stars 92 forks source link

Fatal error: grunt.sprite requires a src, dest (img), and destCss property #176

Closed DevilSquirrel closed 1 year ago

DevilSquirrel commented 1 year ago

image Full configuration:

module.exports = function (grunt) {
  grunt.initConfig({
    jshint: ['Gruntfile.js'],
    less:{
      compile:{
        files:{
          'build/css/compiled.css': [
            'public/css/*.less',
            '!public/**/components.less',
          ]
        }
      }
    },
    concat:{
      js:{
        files:{
          'build/js/bundle.js':'public/js/*.js'
        }
      }
    },
    uglify:{
      bundle:{
        files:{
          'build/js/bundle.min.js':'build/js/bundle.js',
        }
      }
    },
    sprite:{
      icons:{
        src: 'public/image/*.png',
        destImg: 'build/image/icons.png',
        destCss: 'build/image/icons.css'
      }
    }
  });

  grunt.loadNpmTasks('grunt-contrib-less');
  grunt.loadNpmTasks('grunt-contrib-jshint');
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-spritesmith');
  // grunt.registerTask('default',['jshint']);
  grunt.registerTask('js','Concatenate and minify js files',['concat:js','less:compile', 'uglify:bundle']);
};

pacage.json

{
  "devDependencies": {
    "grunt": "^1.6.1",
    "grunt-contrib-concat": "^2.1.0",
    "grunt-contrib-jshint": "^3.2.0",
    "grunt-contrib-less": "^3.0.0",
    "grunt-contrib-uglify": "^5.2.2",
    "grunt-spritesmith": "^6.10.0"
  }
}

I searched for a long time and couldn't find what was wrong. hope to get help thank you!

twolfson commented 1 year ago

destImg should be dest. Additionally, your task is named sprite:icons, not sprite:src when you run it from the CLI =/

    sprite:{
      icons:{
        src: 'public/image/*.png',
        dest: 'build/image/icons.png',
        destCss: 'build/image/icons.css'
      }
    }
DevilSquirrel commented 1 year ago

destImg应该是dest。此外,您的任务被命名为sprite:icons,而不是sprite:src当您从 CLI 运行它时=/

    sprite:{
      icons:{
        src: 'public/image/*.png',
        dest: 'build/image/icons.png',
        destCss: 'build/image/icons.css'
      }
    }

Change destImg to dest and the problem is solved. Thank you very much. I am reading a book and the configuration in the book is very old.