Grunt:Css文件没有最小化

时间:2016-12-05 09:35:21

标签: javascript css gruntjs

问题是我无法将.css文件最小化到dist文件夹中。 当我运行命令'grunt'时,我收到以下错误。帮我。提前谢谢。

Running "concat:dist" (concat) task

Running "cssmin:dist" (cssmin) task
>> No files created.

Running "uglify:dist" (uglify) task
>> No files created.

Running "copy:dist" (copy) task


Running "copy:fonts" (copy) task

我的HTML文件头和Grunt.js的代码如下:

'use strict';

module.exports = function (grunt) {
  // Define the configuration for all the tasks
    	// Time how long tasks take. Can help when optimizing build times
  	require('time-grunt')(grunt);

  	// Automatically load required Grunt tasks
  	require('jit-grunt')(grunt, {
  	  useminPrepare: 'grunt-usemin'
  	}); 
  	// Define the configuration for all the tasks
  	grunt.initConfig({
  	  pkg: grunt.file.readJSON('package.json'),

  	  // Make sure code styles are up to par and there are no obvious mistakes
  	  jshint: {
  	    options: {
  	      jshintrc: '.jshintrc',
  	      reporter: require('jshint-stylish')
  	    },
  	    
  	    all: {
  	      src: [
  	        'Gruntfile.js',
  	        'app/scripts/{,*/}*.js'
  	      ]
  	    }
  	  },
  	  copy: {
  	    dist: {
  	      cwd: 'app',
  	      src: [ '**','!styles/**/*.css','!scripts/**/*.js' ],
  	      dest: 'dist',
  	      expand: true
  	    },
  	    
  	    fonts: {
  	      files: [
  	        {
  	          //for bootstrap fonts
  	          expand: true,
  	          dot: true,
  	          cwd: 'bower_components/bootstrap/dist',
  	          src: ['fonts/*.*'],
  	          dest: 'dist'
  	        }, {
  	          //for font-awesome
  	          expand: true,
  	          dot: true,
  	          cwd: 'bower_components/font-awesome',
  	          src: ['fonts/*.*'],
  	          dest: 'dist'
  	        }
  	      ]
  	    }
  	  },

  	  clean: {
  	    build: {
  	      src: [ 'dist/']
  	    }
  	},


  	useminPrepare: {
  	  html: 'app/detail.html',
  	  options: {
  	    dest: 'dist'
  	  }
  	},

  	// Concat
  	concat: {
  	  options: {
  	    separator: ';'
  	  },
  	  
  	  // dist configuration is provided by useminPrepare
  	  dist: {}
  	},

  	// Uglify
  	uglify: {
  	  // dist configuration is provided by useminPrepare
  	  dist: {}
  	},

  	cssmin: {
  	  dist: {}
  	},

  	// Filerev
  	filerev: {
  	  options: {
  	    encoding: 'utf8',
  	    algorithm: 'md5',
  	    length: 20
  	  },
  	  
  	  release: {
  	    // filerev:release hashes(md5) all assets (images, js and css )
  	    // in dist directory
  	    files: [{
  	      src: [
  	        'dist/scripts/*.js',
  	        'dist/styles/*.css',
  	      ]
  	    }]
  	  }
  	},
  	  
  	// Usemin
  	// Replaces all assets with their revved version in html and css files.
  	// options.assetDirs contains the directories for finding the assets
  	// according to their relative paths
  	usemin: {
  	  html: ['dist/*.html'],
  	  css: ['dist/styles/*.css'],
  	  options: {
  	    assetsDirs: ['dist', 'dist/styles']
  	  }
  	}
  	});

  	grunt.registerTask('build', [
  	  'clean',
  	  'jshint',
  	  'useminPrepare',
  	  'concat',
  	  'cssmin',
  	  'uglify',
  	  'copy',
  	  'filerev',
  	  'usemin'
  	]);
  	grunt.registerTask('default',['build']);

};	
<head>
  <title>Angular JS</title>

  <!-- build:css styles/main.css -->
  <link href="../bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet">
  <link href="../bower_components/bootstrap/dist/css/bootstrap-theme.min.css" rel="stylesheet">
  <link href="../bower_components/font-awesome/css/font-awesome.min.css" rel="stylesheet">
  <link href="styles/bootstrap-social.css" rel="stylesheet">
  <link href="styles/mystyles.css" rel="stylesheet">
  <!-- endbuild -->
</head>

1 个答案:

答案 0 :(得分:0)

您的cssmin:是空的!

您需要执行以下操作:

 cssmin: {
  target: {
    files: [{
      expand: true,
      cwd: 'release/css',
      src: ['dist/styles/*.css', '!*.min.css'],
      dest: 'release/css',
      ext: '.min.css'
    }]
  }
}

看看:https://github.com/gruntjs/grunt-contrib-cssmin