Grunt,css min来连接并缩小所有css

时间:2015-01-03 18:03:44

标签: css gruntjs grunt-contrib-cssmin

我有很多来自插件的各种CSS和我正在使用的单独样式表,我正在尝试构建一个将所有这些组合起来并缩小它们的任务。现在我试着用cssmin做这个,我不确定我是否在正确的道路上,因为这是我第一次尝试这个,但这是我正在尝试的。

cssmin: {
      target: {
        files: {
            'css/output.css': ['css/*.css', 'css/*.min.css']
        },
        files: [{
          expand: true,
          cwd: 'css',
          src: ['css/output.css'],
          dest: 'build/css',
          ext: '.min.css'
        }]
      }
    }

这个想法是它将把我的css文件夹中的所有css和min.css文件合并到1 output.css然后将该build / css缩小为min.css文件。我不太确定这是否可以起作用,但这是我尝试这样做的第一次尝试。基本思想是在我的任务底部将所有内容组合并缩小为1个文件(在我自动加前缀并使用uncss去除引导程序之后)。我很感激任何指导,这是正确的方向吗?这似乎没有正常工作,所以将不胜感激任何帮助。

感谢阅读!

2 个答案:

答案 0 :(得分:4)

我不确定...但这对我有用,只需要在我的grunt.registerTask代码行中包含cssmin任务。它缩小了我所有的autoprefixed .css,除了已经缩小的版本,并将它们组合成一个大的缩小样式表。希望它有所帮助^^

cssmin: {
  minify: {
    files: [{
      expand: true,
      cwd: 'src/styles',
      src: ['**/*.css', '!**/*.min.css'],
      dest: 'public/assets/styles',
      ext: '.min.css'
    }]
  },
  options: {
    shorthandCompacting: false,
    roundingPrecision: -1
  },
  combine: {
    files: {
      'public/assets/styles/style.css': ['!public/assets/styles/**/*.min.css', 'public/assets/styles/**/*.css']
    }
  }
}

答案 1 :(得分:3)

minify任务不是必需的。当您连接多个文件时,cssmin会自动缩小内容。

cssmin: {
  options: {
    shorthandCompacting: false,
    roundingPrecision: -1
  },
  combine: {
    files: {
      'css/output.min.css': ['css/*.css', '!css/*.min.css']
    }
  }
}