1

私は現在、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 & cssmin では不可能ですか?

ありがとう。

4

1 に答える 1