js、cssファイル圧縮例-grunt

1980 ワード

使用方法:


1.次の2つのファイルをプロジェクトルートディレクトリ2に入れる.npm install 3.grunt

プロファイル:


package.json
{
  "name": "my_grunt_config",
  "version": "0.1.0",
  "devDependencies": {
    "grunt": "~0.4.1",
    "grunt-contrib-clean": "^0.6.0",
    "grunt-contrib-concat": "~0.5.0",
    "grunt-contrib-cssmin": "^0.10.0",
    "grunt-contrib-jshint": "~0.6.0",
    "grunt-contrib-uglify": "~0.2.2"
  }
}

Gruntfile.js
module.exports = function (grunt) {
  grunt.initConfig({
    concat: {                           //    
      js: {
        src: ['src/*.js'],
        dest: 'dist/built.js'
      },
      css: {
        src: ['css/*.css'],
        dest: 'dist/built.css'
      }
    },
    uglify: {                          //  JS  
      my_target:{
        files:[
        {
            expand: true,
            cwd: 'src',
            src: ['*.js', '!*.min.js'],
            dest: 'src',
            ext: '.min.js'
        }]
      }       
    },
    cssmin: {                         //  CSS  
      my_target: {
        files: [{
          expand: true,
          cwd: 'css',
          src: ['*.css', '!*.min.css'],
          dest: 'css',
          ext: '.min.css'
        }]
      }
    },
    clean: {                           //  .min.xx  
      js: ["!src/*.js", "src/*.min.js"],
      css: ["!css/*.css", "css/*.min.css"]
    }
  });

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

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