使用 Maven 缩小 CSS

Question

I have a Maven profile for which I want to minify all my javascript and css files. For developing I have compressed.js and compressed.css files which are simply injecting other scripts/stylesheets. What do I want is to override those files with actually compressed ones but only .js minification works for me.

Here's part of my profile:

<plugin>
    <groupId>net.alchim31.maven</groupId>
    <artifactId>yuicompressor-maven-plugin</artifactId>
    <version>1.1</version>
    <executions>
        <execution>
            <goals>
                <goal>compress</goal>
            </goals>
        </execution>
    </executions>
    <configuration>
        <linebreakpos>999999</linebreakpos>
        <jswarn>false</jswarn>
        <excludes>
            <exclude>**/compressed.js</exclude>
        </excludes>
        <aggregations>
            <aggregation>
                <removeIncluded>true</removeIncluded>
                <insertNewLine>false</insertNewLine>
                <output>${project.build.directory}/${project.build.finalName}/js/compressed.js
                </output>
                <includes>
                    <include>**/components/sample-min.js</include>
                    <include>**/components/sample2-min.js</include>
                </includes>
                <excludes>
                    <exclude>**/compressed.js</exclude>
                </excludes>
            </aggregation>
        </aggregations>
    </configuration>
</plugin>
<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-war-plugin</artifactId>
    <configuration>
        <excludes>js/**</excludes>
    </configuration>
</plugin>

When I modify the following lines, it simply doesn't work when there's already compressed.css present, when not, it minifies okay.

Add to yuicompressor-maven-plugin :

<exclude>**/compressed.css</exclude>
...
<aggregations>
    <aggregation>
        <removeIncluded>true</removeIncluded>
        <insertNewLine>false</insertNewLine>
        <output>${project.build.directory}/${project.build.finalName}/css/compressed.css
        </output>
        <includes>
            <include>**/sample-min.css</include>
            <include>**/sample2-min.css</include>
        </includes>
        <excludes>
            <exclude>**/compressed.css</exclude>
        </excludes>
    </aggregation>

Change in maven-war-plugin :

<excludes>
    <exclude>js/**</exclude>
    <exclude>css/**</exclude>
</excludes>

Please, what am I doing wrong?

Answer 1

Yui compressor is very old for compressing .js files. I used yui compressor for .css and google closure compiler for .js files. Codes are shown below. They minifies all your .css and .js files and overwrites them at build phase of your project.

    <!-- css compression -->
        <plugin>
            <groupId>net.alchim31.maven</groupId>
            <artifactId>yuicompressor-maven-plugin</artifactId>
            <version>1.5.1</version>
            <executions>
                <execution>
                    <configuration>
                        <webappDirectory>${project.build.sourceDirectory}\src\main\resources\public\assets</webappDirectory>
                        <nosuffix>true</nosuffix>
                        <force>true</force>
                        <jswarn>false</jswarn>
                        <excludes>
                            <exclude>**/*.min.js</exclude>
                            <exclude>**/*-min.js</exclude>
                            <exclude>**/*.js</exclude>
                        </excludes>
                    </configuration>
                    <goals>
                        <goal>compress</goal>
                    </goals>
                </execution>
            </executions>
        </plugin>

    <!--JavaScript Compression Part-->
        <plugin>
            <groupId>com.github.blutorange</groupId>
            <artifactId>closure-compiler-maven-plugin</artifactId>
            <version>2.16.0</version>
            <configuration>
                <baseSourceDir>${project.basedir}\src\main\resources\public\assets</baseSourceDir>
                <baseTargetDir>${project.build.directory}\classes\public\assets</baseTargetDir>
            </configuration>
            <executions>
                <execution>
                    <id>default-minify</id>
                    <configuration>
                        <encoding>UTF-8</encoding>
                        <sourceDir></sourceDir>
                        <outputFilename>#{path}/#{basename}.#{extension}</outputFilename>
                        <targetDir></targetDir>
                        <includes>**/*.js</includes>
                        <excludes>
                            <exclude>**/*.min.js</exclude>
                        </excludes>
                        <skipMerge>true</skipMerge>
                        <closureLanguageOut>ECMASCRIPT5</closureLanguageOut>
                    </configuration>
                    <goals>
                        <goal>minify</goal>
                    </goals>
                    <phase>generate-resources</phase>
                </execution>
            </executions>
        </plugin>