TOTVS Fluig Español

Árvore de páginas


Introducción

Esta documentación tiene el objetivo de explicar cómo se realiza la configuración del plugin Closure compiler Maven Plugin

Hoy en día, la plataforma Fluig utiliza el plugin del compresor YUI para minificar archivos CSS y JS. Sin embargo, permanece inactivo y no se actualiza desde 2013, quedando un poco desactualizado y nos imposibilita el uso de nuevas tecnologías, como ES6.


¿Fin del compresor YUI?

No se podrá eliminar por completo el compresor YUI de nuestro producto ya que Closure Compiler no procesará archivos CSS, solo JS. Siendo necesaria la permanencia del antiguo para minificar la página de estilo.


Configuración del plugin

Los plugins se configuran en los pom.xml de cada proyecto. Primero debemos hacer que el compresor YUI deje de minificar los archivos JS, para eso en la configuración que ya existe necesitamos agregar la siguiente tag dentro de la configuración.


En el ejemplo vamos a usar el widget: sample-component-widget

Ignorando archivos JS - Compresor YUI
<configuration>                        
  …
  <excludes>
    <exclude>**/*.js</exclude>
  </excludes>
  …
</configuration>


Una vez hecho esto, podemos configurar Closure Compiler.

Ejemplo de configuración usada en el pom: sample-component-widget
<plugin>
    <groupId>com.github.blutorange</groupId>
    <artifactId>closure-compiler-maven-plugin</artifactId>
    <version>2.21.0</version>
    <executions>
        <execution>
            <id>default-minify</id>
            <goals>
                <goal>minify</goal>
            </goals>
            <phase>generate-resources</phase>
        </execution>
    </executions>
    <configuration>
        <skip>false</skip>
        <baseSourceDir>${project.basedir}/src</baseSourceDir>
        <encoding>UTF-8</encoding>
        <sourceDir>main/webapp/resources</sourceDir>
        <targetDir>resources</targetDir>
        <includes>**/*.js</includes>
        <outputFilename>#{path}/#{basename}.#{extension}</outputFilename>
        <excludes>**/${project.basedir}</excludes>
        <excludes>**/*.min.js</excludes>
        <excludes>**/*-min.js</excludes>
        <closureCompilationLevel>SIMPLE_OPTIMIZATIONS</closureCompilationLevel>
        <closureWarningLevels>
            <undefinedVars>OFF</undefinedVars>
            <duplicate>OFF</duplicate>
            <duplicateMessage>OFF</duplicateMessage>
            <es5Strict>OFF</es5Strict>
            <checkVars>OFF</checkVars>
        </closureWarningLevels>
        <closureEmitUseStrict>false</closureEmitUseStrict>
        <closureRewritePolyfills>false</closureRewritePolyfills>
        <closureLanguageOut>NO_TRANSPILE</closureLanguageOut>
        <skipMinify>false</skipMinify>
        <skipMerge>true</skipMerge>
    </configuration>
</plugin>

Se puede acceder a su documentación aquí: https://blutorange.github.io/closure-compiler-maven-plugin/minify-mojo.html


Donde hay una explicación de cada tag usada, a continuación se encuentra la explicación de algunas configuraciones específicas.

  • ClosureCompilationLevel - definirá qué tan avanzada será la minificación, en el nivel ADVANCED_OPTIMIZATIONS es posible tener ofuscación de los archivos JS.
  • Excludes - Usamos el excludes para borrar algún tipo de archivo específico de la compilación.
  • Skip - Ignora la ejecución del plugin dentro del módulo declarado.

Atención

Actualmente, si el plugin no encuentra un js dentro del directorio fuente definido, se rompe. Por lo tanto, en proyectos donde el pom principal no tiene archivos para minificar, pasamos el skip como verdadero. Sin embargo, es necesario que en sus secundarios esté la configuración:

			<plugin>
                <groupId>com.github.blutorange</groupId>
                <artifactId>closure-compiler-maven-plugin</artifactId>
                <configuration>
                    <skip>false</skip>
                </configuration>
        	</plugin>

Atención

Actualmente la minificación realizada en los archivos javaScript por el plugin puede causar un conflicto entre la template de string y el mecanismo de internacionalización i18n, lo que puede generar inconsistencias. Si no usa la internacionalización en su JS, la template string funcionará normalmente. Estamos trabajando para proporcionar una solución en versiones futuras.

  • Sem rótulos