2011-05-20 9 views
14

Tengo un archivo javascript que se usa para rastrear eventos usando Google Analytics. He creado diferentes cuentas para el entorno de producción y producción. La secuencia de comandos para invocar el código GA tiene un marcador de posición para mi Id. De cuenta. Los Id. De la cuenta se han especificado en los archivos de filtro. Usando el elemento webResources en el plugin de maven-war, podemos reemplazar exitosamente la propiedad en el archivo WAR final.¿Cómo minimizar un archivo javascript filtrado usando maven?

Ahora, también estamos utilizando el complemento maven-yuicompressor para minimizar y agregar todos nuestros archivos javascript. El problema es que si adjunto la ejecución del objetivo minify a la fase del paquete, el WAR se crea antes de que el Javascript se haya minimizado. Si adjunto el objetivo minify a algo anterior, el filtro no se ha aplicado hasta el momento de la minificación y se ha producido un archivo no válido.

Por lo tanto, estoy buscando una forma de ejecutar el objetivo minify entre el complemento WAR copiando los archivos JS filtrados y creando el archivo WAR. Estas son las partes pertinentes de mi pom.xml:

  <plugin> 
      <groupId>org.apache.maven.plugins</groupId> 
      <artifactId>maven-war-plugin</artifactId> 
      <version>2.1.1</version> 
      <configuration> 
       <webResources> 
       <resource> 
        <directory>src/main/webapp/js</directory> 
        <targetPath>js</targetPath> 
        <filtering>true</filtering> 
       </resource> 
       </webResources> 
      </configuration> 
      </plugin> 
      <plugin> 
      <groupId>net.alchim31.maven</groupId> 
      <artifactId>yuicompressor-maven-plugin</artifactId> 
      <version>1.1</version> 
      <executions> 
       <execution> 
       <goals> 
        <goal>compress</goal> 
       </goals> 
       <phase>package</phase> 
       </execution> 
      </executions> 
      <configuration> 
       <linebreakpos>-1</linebreakpos> 
       <nosuffix>true</nosuffix> 
       <force>true</force> 
       <aggregations> 
       <aggregation> 
        <output>${project.build.directory}/${project.build.finalName}/js/mysite-min.js</output> 
        <inputDir>${project.build.directory}/${project.build.finalName}/js</inputDir> 
        <includes> 
        <include>jquery-1.4.2.js</include> 
        <include>jquery-ui.min.js</include> 
        <include>ga-invoker.js</include> 
        </includes> 
       </aggregation> 
       </aggregations> 
      </configuration> 
      </plugin> 
+0

¿Se puede unir a 'prepare-package'? –

+0

Como mencioné antes, adjuntar algo antes de la fase del paquete no funciona, ya que el filtro no se ha aplicado hasta entonces. El complemento de guerra copia los recursos web y aplica el filtro como parte de la fase del paquete. – Chandranshu

Respuesta

6

¿Se puede poner los archivos js filtrados en src/main/resources/filtrada-js, utilizar los recursos de aplicación en lugar, que se une a process-resources, a continuación, seleccione el configuración de recursos web de maven-war-plugin a target/classes/filtered-js?

+1

Me has ganado para publicar la respuesta. Hice algo similar ayer. Dejo que el plugin yuicompressor permanezca unido a la fase de recursos de proceso, que es el predeterminado, pero configura su salida para ir a target/js. Luego utilicé la configuración de webResources del plugin de maven-war para filtrar los contenidos de este directorio y ponerlos en target//js. Aún debe marcar su respuesta como la correcta. – Chandranshu

9

Una gran pregunta, un gran artículo de artbristol, que he votado a favor. Me ayudó mucho. Para referencia futura publico una solución completa:

  • Ponga sus archivos Javascript en src/main/resources/js (o lo que se adecue a sus necesidades)
  • colocar los archivos CSS en src/main/resources/css (o lo que se adapte a sus necesidades)
  • Recursos plugin es filtrar los recursos de javascript y los copia a target/classes/js/
  • Yui es recoger los archivos a la diana/clases/js/y agregados a src/main/webapp
  • puede probar su configuración con jetty:run. Embarcadero está recogiendo los archivos comprimidos y agregados en el plugin de src/main/webapp
  • guerra en fase de paquete es recoger sus archivos bajo src/main/webapp
  • opcional poner un archivo SMC ignorar como .svnignore o .cvsignore archivo en src/main/webapp excluir all.js de su herramienta favorita SMC .

La sección de exclusión es necesaria para evitar comprimir cualquier cosa en src/main/resources y src/main/webapp. yui solo debería recoger los archivos ya filtrados para la agregación.

<build> 
    <resources> 
     <resource> 
      <directory>src/main/resources</directory> 
      <filtering>true</filtering> 
     </resource> 
    </resources> 
    <plugins> 
     <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> 
       <excludes> 
        <exclude>*/*</exclude> 
       </excludes> 
       <force>true</force> 
       <nosuffix>true</nosuffix> 
       <removeIncluded>true</removeIncluded> 
       <aggregations> 
        <aggregation> 
         <insertNewLine>true</insertNewLine> 
         <output>${project.basedir}/src/main/webapp/js/all.js</output> 
         <includes> 
          <include>${project.build.directory}/classes/js/file1.js</include> 
          <include>${project.build.directory}/classes/js/file2.js</include> 
        </aggregation> 
        <aggregation> 
         <insertNewLine>true</insertNewLine> 
         <output>${project.basedir}/src/main/webapp/css/all.css</output> 
         <includes> 
          <include>${project.build.directory}/classes/css/file1.css</include> 
          <include>${project.build.directory}/classes/css/file2.css</include> 
        </aggregation> 
       </aggregations> 
      </configuration> 
     </plugin> 

¿Por qué quieres filtrado de archivos css?

lo uso para hacer referencia a mis imágenes como esta

div.header { 
    background-image: url(/img/background.${project.version}.png) 
} 

Maven filtra mi versión de proyecto en mis archivos CSS.Cualquier solicitud entrante en nuestro ImageServer se filtra como este

protected void doHttpFilter (HttpServletRequest request, HttpServletResponse response, FilterChain chain) throws IOException, ServletException 
{ 
    String uri = request.getRequestURI(); 
    if (isStaticRequest(uri)) 
    { 
     String uriWithoutVersion = stripVersionString(uri); 
     String versionRequested = getVersionString(uri); 
     if (version.equals(versionRequested)) 
     { 
      response.setHeader(CACHE_CONTROL_HEADER_NAME, CACHE_CONTROL_HEADER_VALUE); 
      response.setHeader(EXPIRES_HEADER_NAME, EXPIRES_HEADER_VALUE); 
     } 
     RequestDispatcher dispatcher = request.getRequestDispatcher(uriOhneVersionsnummer); 
     dispatcher.forward(request, response); 
    } else { 
     chain.doFilter(request, response); 
     return; 
    } 
} 

esta manera el navegador almacena en caché cada archivo para siempre. pero cuando subo una nueva versión, todas las referencias de archivos tienen un nuevo número de versión, por lo que el navegador está recuperando la imagen o css nuevamente. esto nos ayudó mucho a reducir el tráfico.

2

Estoy usando Maven Minify Plugin para comprimir los archivos javascript y css. También se fusiona estos archivos en un solo file.This está trabajando muy bien plugin de

he utilizado experto en marcas de tiempo para poner un sufijo unque a estos archivos como un solution.This caché del navegador también está trabajando bien

Lo Estoy atascado es cómo reemplazar toda la referencia de los js y css con los nuevos creados en el tiempo de ejecución de la construcción.

Estoy buscando en maven-replace-plugin para el mismo. Puede eliminar todas las instancias. Puede reemplazar con nuevos valores. Pero necesito mantener una instancia de los js y css recién fusionados.

<plugins> 
    <plugin> 
    <groupId>com.keyboardsamurais.maven</groupId> 
    <artifactId>maven-timestamp-plugin</artifactId> 
    <version>1.0</version> 
    <configuration> 
    <propertyName>timestamp</propertyName> 
    <timestampPattern>ddMMyyyyHHmm</timestampPattern> 
    </configuration> 
    <executions> 
    <execution> 
     <goals> 
     <goal>create</goal> 
     </goals> 
    </execution> 
    </executions> 
    </plugin> 
    <plugin> 
    <artifactId>maven-resources-plugin</artifactId> 
    <version>2.5</version> 
    <executions> 
    <execution> 
     <id>copy-resources</id> 
     <!-- here the phase you need --> 
     <phase>validate</phase> 
     <goals> 
     <goal>copy-resources</goal> 
     </goals> 
     <configuration> 
     <outputDirectory>${basedir}/target/resources/themes</outputDirectory> 
     <resources> 
     <resource> 
     <includes> 
      <include>**/*.vm</include> 
     </includes> 
     <directory>${basedir}/src/main/resources/themes</directory> 
     <filtering>true</filtering> 
     </resource> 
     </resources> 
     </configuration> 
    </execution> 
    </executions> 
    </plugin> 
    <plugin> 
    <groupId>com.samaxes.maven</groupId> 
    <artifactId>maven-minify-plugin</artifactId> 
    <version>1.3.5</version> 
    <executions> 
    <execution> 
     <id>default-minify</id> 
     <phase>process-resources</phase> 
     <configuration> 
     <cssSourceDir>../resources/themes/XXXX/default/template-resources/stylesheet</cssSourceDir> 
     <cssSourceIncludes> 
     <cssSourceInclude>**/*.css</cssSourceInclude> 
     </cssSourceIncludes> 
     <cssFinalFile>style.css</cssFinalFile> 
     <jsSourceDir>../resources/themes/XXXX/default/template-resources/js</jsSourceDir> 
     <jsSourceIncludes> 
     <jsSourceInclude>*.js</jsSourceInclude> 
     </jsSourceIncludes> 
     <jsSourceFiles> 
     <jsSourceFile>/libs/json.js</jsSourceFile> 
     </jsSourceFiles> 
     <jsFinalFile>script.js</jsFinalFile> 
     <suffix>-${timestamp}</suffix> 
     </configuration> 
     <goals> 
     <goal>minify</goal> 
     </goals> 
    </execution> 
    </executions> 
    </plugin> 
    <plugin> 
    <groupId>com.google.code.maven-replacer-plugin</groupId> 
    <artifactId>replacer</artifactId> 
    <version>1.5.0</version> 
    <executions> 
    <execution> 
     <phase>prepare-package</phase> 
     <goals> 
     <goal>replace</goal> 
     </goals> 
    </execution> 
    </executions> 
    <configuration> 
    <includes> 
     <include>target/resources/themes/XXXX/default/templates/velocity/**/*.vm</include> 
    </includes> 
    <replacements> 
     <replacement> 
     <token><![CDATA[<link rel="stylesheet" href="/storefront/template-resources/stylesheet/]]>([a-zA-Z0-9\-\_]*.css)<![CDATA[" type="text/css"/>]]>([])</token>  
     <value></value> 
     </replacement> 
     <replacement> 
     <token><![CDATA[<link rel="stylesheet" href="/storefront/template-resources/stylesheet/powerreviews]]>([a-zA-Z0-9\-\_]*.css)<![CDATA[" type="text/css"/>]]></token>  
     <value></value> 
     </replacement> 

     <replacement> 
     <token><![CDATA[<script type="text/javascript" src="/storefront/template-resources/js/]]>([a-zA-Z0-9\-\_\.]*.js)<![CDATA["></script>]]></token> 
     <value></value> 
     </replacement> 
     <replacement> 
     <token><![CDATA[<script type="text/javascript" src="/storefront/template-resources/js/libs/]]>([a-zA-Z0-9\-\_\.]*.js)<![CDATA["></script>]]></token> 
     <value></value> 
     </replacement> 
    </replacements> 
    </configuration> 
    </plugin> 
    <plugin> 
    <groupId>org.apache.maven.plugins</groupId> 
    <artifactId>maven-assembly-plugin</artifactId> 
    <executions> 
    <execution> 
     <id>dist</id> 
     <goals> 
     <goal>single</goal> 
     </goals> 
     <phase>package</phase> 
     <configuration> 
     <descriptors> 
     <descriptor>src/main/assembly/assembly.xml</descriptor> 
     </descriptors> 
     </configuration> 
    </execution> 
    </executions> 
    </plugin> 
    </plugins> 
+0

para la prevención del almacenamiento en memoria caché, es posible que desee utilizar sumas de comprobación MD5 en lugar de marcas de tiempo. Con las marcas de tiempo, su caché se invalidará cada vez que realice una compilación, independientemente de si cambia el JS y el CSS. – Chandranshu

Cuestiones relacionadas