TOTVS Fluig

Atalhos

Árvore de páginas



Introdução

Essa documentação tem como objetivo explicar como é feita a configuração do plugin Closure compiler Maven Plugin

Hoje no Fluig plataforma utiliza-se o plugin YUI compressor para minificar arquivos CSS e JS. Porém o mesmo permanece inativo e sem atualização desde 2013 ficando um pouco ultrapassado e nos impossibilitando de utilizar novas tecnologias, como o ES6.

Fim do YUI Compressor?

Não será possível remover completamente o YUI-Compressor de nosso produto pois o Closure Compiler não irá processar arquivos CSS, apenas JS. Sendo necessário a permanência do antigo para minificar a folha de estilo.

Configurando o plugin

Os plugins são configurados nos pom.xml de cada projeto. Primeiramente devemos fazer com que o YUI-Compressor pare de minificar os arquivos JS, para isso na configuração já existente precisamos adicionar a seguinte tag dentro da configuração.


No exemplo estaremos utilizando a widget: sample-component-widget

Ignorando arquivos JS - YUI Compressor
<configuration>                        
  …
  <excludes>
    <exclude>**/*.js</exclude>
  </excludes>
  …
</configuration>


Feito isso, podemos configurar o Closure Compiler. 

Exemplo de configuração usada no 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>


A documentação do mesmo pode ser acessada aqui: https://blutorange.github.io/closure-compiler-maven-plugin/minify-mojo.html

Onde há a explicação de cada tag utilizada - abaixo estará a explicação de algumas configurações específicas.

  • ClosureCompilationLevel - irá definir o quão avançada será a minificação - no nível ADVANCED_OPTIMIZATIONS é possível ter a ofuscação dos arquivos JS.
  • Excludes - Utilizamos o excludes para excluir algum tipo de arquivo específico da compilação.
  • Skip - Ignora a execução do plugin dentro do módulo declarado.

Atenção

Atualmente, caso o plugin não encontre um js dentro do source dir definido ele quebra. Por isso, em projetos onde o pom pai não possui arquivos a serem minificados, passamos o skip como true. Porém é necessário que em seus filhos haja a configuração:

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

Atenção

Hoje a minificação realizada nos arquivos javaScript pelo plugin pode ocasionar um conflito entre o template de string e o mecanismo de internacionalização i18n, podendo gerar inconsistências. Caso você não use internacionalização em seu JS, template string irá funcionar normalmente. Estamos trabalhando a fim de proporcionar uma solução em próximas versões.

  • Sem rótulos