Question

我目前正在使用Yeoman生成的Gruntfile，我希望连接并缩小我的CSS。我为我的JavaScript做的方式似乎工作正常但是当我尝试将相同的方法应用于我的css文件时，我只是将它们连接在一起而没有缩小。

以下是我在index.html文件中所做的事情：

    <!-- build:css styles/dist.bundle.css -->
    <link rel="stylesheet" href="styles/loader.css" />
    <link rel="stylesheet" href="styles/social.css" />
    <link rel="stylesheet" href="styles/main.css" />
    <!-- endbuild -->

请注意，如果我删除构建块注释，我会得到一个缩小版本，但只有3个单独的文件。

在我的Gruntfile配置中，我有以下内容：

    cssmin: {
        dist: {
            files: {
                '<%= yeoman.dist %>/styles/dist.bundle.css': [
                    '.tmp/styles/{,*/}*.css',
                    '<%= yeoman.app %>/styles/{,*/}*.css'
                ]
            }
        }
    }

我的usemin配置只是默认配置：

    useminPrepare: {
        html: '<%= yeoman.app %>/index.html',
        options: {
            dest: '<%= yeoman.dist %>'
        }
    },
    usemin: {
        html: ['<%= yeoman.dist %>/{,*/}*.html'],
        css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
        options: {
            dirs: ['<%= yeoman.dist %>']
        }
    }

任何人都可以建议我如何实现我正在寻找的东西吗？或者使用usemin＆amp; cssmin？

感谢。

Answer 1

你可以把你的grunt文件粘贴吗？因为usemin不会自行连接/缩小/ uglify，而是告诉将要使用的文件的任务，也许你不会要求grunt在连接后缩小文件

Grunt concat和缩小css文件

1 个答案: