如何解决此错误:找不到Grunt构建,使用--force继续

时间:2017-03-31 17:07:01

标签: javascript gruntjs

我正和Grunt一起做项目。该项目有2个部分:开发和构建。 开发部分没有问题,但构建部分出错了。

我认为我的gruntfiles.js文件存在严重问题。

以下是它的内容:

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    // define reusable paths
    paths: {
        app: 'app',
        dist: 'dist',
        app_css:'<%= paths.app %>/css',
        app_js:'<%= paths.app %>/js',
        app_img: '<%= paths.img %>/img'
        source_scss: '<%= paths.app %>/src/scss',
        source_js: '<%= paths.app %>/src/js',
        source_bower: '<%= paths.app %>/src/bower',
        dist_css: '<%= paths.dist %>/css',
        dist_js: '<%= paths.dist %>/js',
        dist_img: '<%= paths.dist %>/img'
    },

    sass: {
        dev: {
            options: {
                outputStyle: 'expanded',
                sourceMap: false
                     },

            files: {
                '<%= paths.app_css %>/styles.css': '<%= paths.source_scss %>/app.scss'
                   }
             },

        build: {
            options: {
                outputStyle: 'compressed',
                sourceMap: false
            },
            files: {
                '<%= paths.dist_css %>/styles.css': '<%= paths.app_scss %>/styles.scss'
                    }
                }
        },


    browserSync: {
        files: {
            src: ['<%= paths.app_css %>/*.css', '<%= paths.app_js %>/*.js', '<%= paths.app %>/*.html']
        },
        options: {
            browser: 'firefox',
            server: '<%= paths.app %>',
            watchTask: true
        }
    },

    watch: {
        sass: {
            files: ['<%= paths.source_scss %>/**/*.scss'],
            tasks: ['sass:dev', 'concat:css']
        },
        js: {
            files: ['<%= paths.source_js %>/*.js'],
            tasks: ['jshint', 'uglify:dev']
        }
    },

    jshint: {
        dev: {
            files: {
                src: '<%= paths.source_js %>/*.js'
            }
        },
        options: {
            reporter: require('jshint-stylish')
        }
    },

    bower: {
        dev: {
            dest: '<%= paths.source_bower %>',
            js_dest: '<%= paths.source_bower %>/js',
            css_dest: '<%= paths.source_bower %>/styles'
        }
    },

    copy: {

        html: {
            expand: true,
            cwd: '<%= paths.app %>',
            src: '*.html',
            dest: '<$= paths.dist $>/',
            options: {
                process: function(content, srcpath){
                    return content.replace('scripts.js', 'scripts.min.js')
                                                    }
                    }
               }

         },

    clean: {
        dist: {
            src: '<%= paths.dist %>/css'
            }
    },

    imagemin: {
        build: {
            files: [
                {
                    expand: true,
                    cwd: '<%= paths.app_img %>',
                    src: ['<%= **/*.{png,jpg,gif,svg,ico}'],
                    dest: '<%= paths.dist_img %>'
                }
                    ]
                }
            },

    concat: {
        css: {
            src: ['<%= paths.app_css %>/styles.css', '<%= paths.source_bower %>/styles/**/*.css'],
            dest: '<%= paths.app_css %>/styles.css'
        }
    },

    uglify: {
        dev: {
            options: {
                beautify: true,
                mangle: false,
                compress: false,
                preserveComments: 'all'
            },
            src: ['<%= paths.source_js %>/*.js', '<%= paths.source_bower %>/js/**/*.js'],
            dest: '<%= paths.app_js %>/scripts.js'
            },
        build: {
            src: ['<%= paths.source_js %>/*.js', '<%= paths.source_bower %>/js/**/*.js'],
            dest: '<%= paths.dist_js %>/scripts.min.js'
            }

    }

  });

  // Load the plugin that provides the "uglify" task.

  // Browser sync
  grunt.loadNpmTasks('grunt-browser-sync');

  // Sass
  grunt.loadNpmTasks('grunt-sass');

  // Contribu watch
  grunt.loadNpmTasks('grunt-contrib-watch');

  // Jshint
  grunt.loadNpmTasks('grunt-contrib-jshint');

  // Bower
  grunt.loadNpmTasks('grunt-bower');

  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-imagemin');
  grunt.loadNpmTasks('grunt-contrib-copy');
  grunt.loadNpmTasks('grunt-contrib-clean');




  //Creat tasks


  // Default task(s).
  grunt.registerTask('default', ['browserSync', 'watch']);
  grunt.registerTask('build', ['clean:dist', 'copy', 'imagemin', 'uglify:build', 'concat:css', 'sass:build']);

};

这是我的package.json文件:

{
  "name": "dev",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "grunt": "^1.0.1",
    "grunt-bower": "^0.21.4",
    "grunt-browser-sync": "^2.2.0",
    "grunt-contrib-clean": "^1.0.0",
    "grunt-contrib-concat": "^1.0.1",
    "grunt-contrib-copy": "^1.0.0",
    "grunt-contrib-imagemin": "^1.0.1",
    "grunt-contrib-jshint": "^1.1.0",
    "grunt-contrib-uglify": "^2.2.0",
    "grunt-contrib-watch": "^1.0.0",
    "grunt-sass": "^2.0.0",
    "jshint-stylish": "^2.2.1"
  }
}

运行时

grunt build

我收到了这个错误:

   Loading "gruntfile.js" tasks...ERROR
   >> SyntaxError: Unexpected identifier
   Warning: Task "build" not found. Use --force to continue.

我的项目文件:

├── css
│   └── styles.css
├── img
│   └── Screenshot from 2017-03-31 22-23-33.png
├── index.html
├── js
│   └── scripts.js
├── src
│   ├── bower
│   │   ├── js
│   │   │   └── dist
│   │   │       └── jquery.js
│   │   └── styles
│   │       └── normalize.css
│   ├── js
│   │   └── scripts.js
│   └── scss
│       └── app.scss
└── terminal.glue

请你帮我解决这个问题!

非常感谢你!

1 个答案:

答案 0 :(得分:0)

你好像错过了一个逗号: // define reusable paths paths: { app: 'app', dist: 'dist', app_css:'<%= paths.app %>/css', app_js:'<%= paths.app %>/js', app_img: '<%= paths.img %>/img' // <---------------------miss here source_scss: '<%= paths.app %>/src/scss', source_js: '<%= paths.app %>/src/js', source_bower: '<%= paths.app %>/src/bower',

尝试使用jshint / jslint(等)来避免编辑或ide这样的问题。