Maven:你如何更新html文件以使用新的minified&串联的JS& CSS文件?

时间:2015-09-30 15:06:52

标签: java maven spring-mvc spring-boot

我有很多CSS&在我的HTML中的JS文件,我正在使用YUI Compressor来缩小和缩小将所有这些连接成1x CSS和1x JS。

有没有办法让maven进入我的HTML文件,删除20多行&包括并替换为缩小的那个?

2 个答案:

答案 0 :(得分:1)

一个好的选择是使用Grunt替换html文件中的引用。有一个Grunt插件可以执行此操作:grunt-usemin

例如:

<!-- build:js js/app.minjs -->
<script src="js/controllers/thing-controller.js"></script>
<script src="js/models/thing-model.js"></script>
<script src="js/views/thing-view.js"></script>
<!-- endbuild -->

输出文件:

<script src="js/app.min.js"></script>

答案 1 :(得分:0)

您可以使用minify-maven-plugin在构建时缩小文件。

        <plugin>
          <groupId>com.samaxes.maven</groupId>
          <artifactId>minify-maven-plugin</artifactId>
          <version>1.6.2</version>

          <!--The given minified Executions are used in all web-apps  -->

          <executions>

            <execution>
              <id>js-minify</id>
              <phase>compile</phase>
              <configuration>
                <charset>UTF-8</charset>
                <nosuffix>true</nosuffix>
                <jsSourceDir>static/js</jsSourceDir>
                <jsSourceFiles>
                  <jsSourceFile>template.scroll.js</jsSourceFile>
                  <jsSourceFile>template.input.js</jsSourceFile>
                  <jsSourceFile>template.modal.js</jsSourceFile>
                  <jsSourceFile>template.table.js</jsSourceFile>
                </jsSourceFiles>
                <jsTargetDir>static/js</jsTargetDir>
                <jsFinalFile>template-common-minified.js</jsFinalFile>
                <jsEngine>CLOSURE</jsEngine>
              </configuration>
              <goals>
                <goal>minify</goal>
              </goals>
            </execution>

            <execution>
              <id>template-js-minify</id>
              <phase>compile</phase>
              <configuration>
                <charset>UTF-8</charset>
                <nosuffix>true</nosuffix>
                <jsSourceDir>static/js</jsSourceDir>
                <jsSourceFiles>
                  <jsSourceFile>template.tabs.js</jsSourceFile>
                  <jsSourceFile>template.tooltip.js</jsSourceFile>
                  <jsSourceFile>template.message.js</jsSourceFile>
                </jsSourceFiles>
                <jsTargetDir>static/js</jsTargetDir>
                <jsFinalFile>template-metooltab-minified.js</jsFinalFile>
                <jsEngine>CLOSURE</jsEngine>
              </configuration>
              <goals>
                <goal>minify</goal>
              </goals>
            </execution>

          </executions>
        </plugin>

以上两次执行会缩小JS文件。您也可以使用CSS文件。 在您的HTML中使用此JS文件

<script src="template-metooltab-minified.js"></script> <script src="template-common-minified.js"></script>