发出命令 Grunt 时出错

Question

我开始探索 Grunt。看了几个网站，我看到了例子。好吧，我创建了 package.json 和 Gruntfile.js：

package.json http://pastebin.com/Kkt8fuXJ

Gruntfile.j http://pastebin.com/LnSmTzXZ

我的项目文件夹的组织方式是：

root (index.html)
-src (where is package.json and Gruntfile.js)
-lib
 --css
  ---min
 --js
 --img

当我发出命令时，总是会出现这个错误：

Loading "Gruntfile.js" tasks...ERROR
>> Error: Unable to parse "package.json" file (Unexpected token }).
Warning: Task "default" not found. Use --force to continue.

Aborted due to warnings.

如果我删除 pkg: grunt.file.readJSON('package.json'),:

        grunt.loadNpmTasks('grunt-contrib-imagemin');
        ^^^^^
Loading "Gruntfile.js" tasks...ERROR
>> SyntaxError: Unexpected identifier
Warning: Task "default" not found. Use --force to continue.

Aborted due to warnings.

怎么了？

谢谢

Answer 1

第一个错误是由于您的 package.json 不是有效的 JSON。据我所知，您在第 9 行末尾使用了不必要的逗号。有效的 JSON 将是：

{
  "name": "EREBD",
  "description": "Site do evento EREBD XVII",
  "version": "1.0.0",
  "main": "Gruntfile.js",
  "dependencies": {
    "grunt": "~0.4.1",
    "grunt-contrib-cssmin": "~0.6.1",
    "grunt-contrib-imagemin": "~0.1.4"  //<- no comma there
  }
}

但是您甚至不需要在 Gruntfile 中导入 package.json，因为您并没有使用它的任何属性。那么你的 Gruntfile 有什么问题呢？好吧，您正在加载您的 npm 任务并在导出函数之外定义您的 grunt 任务。这就是正确的方式：

module.exports = function(grunt) {
    grunt.initConfig({
        // image optimization
        imagemin: {
            dist: {
                options: {
                    optimizationLevel: 4,
                    progressive: true
                },
                files: [{
                    expand: true,
                    cwd: '../lib/img/',
                                        src: '**/*',
                    dest: '../lib/img/'
                }]
            }
        },
        // minify css
        cssmin: {
                minify: {
                    expand: true,
                    src: ['../lib/css/*.css'],
                    dest: '../lib/css/min/',
                    ext: '.min.css'
                }
        }
    });

    // load tasks
    grunt.loadNpmTasks('grunt-contrib-imagemin');
    grunt.loadNpmTasks('grunt-contrib-cssmin');

    // extra tasks

    // register task
    grunt.registerTask('default', [
        'imagemin',
        'cssmin'
    ]);
};