Include em estilos Javascript e Groovy

Um estilo pode ser dividido em partes menores para reaproveitamento de código. Para incluir uma dessas partes em outra, pode-se utilizar a diretiva #lum_include.

É importante notar que a diretiva #lum_include é uma diretiva de pré-processamento que indica ao LumisXP para obter o texto de outro arquivo e inserir no local onde a diretiva encontra-se presente. Esse processamento é realizado antes da execução do script.

Essa diretiva aceita um único parâmetro do tipo string que é o caminho do arquivo (relativo ao script atual) que deve ser incluído.

Exemplo:

Arquivo /br/com/empresa/style/commons/utils.js:
let ProjectUtils = { someFunction(param1) { return ` <div> Olá, ${ param1 }! </div> `; } };

Arquivo /br/com/empresa/style/servico1/estilo.js:
<% #lum_include("../commons/utils.js") %> <ul> <li> <% lum_out.print( ProjectUtils.someFunction("Mundo") ); %> </li> </ul>

Supondo nesse exemplo que uma interface utilize o arquivo /br/com/empresa/style/servico1/estilo.js como seu estilo, o LumisXP iria processar esse estilo e o script a ser utilizado na transformação seria:
<% let ProjectUtils = { someFunction(param1) { return ` <div> Olá, ${ param1 }! </div> `; } }; %> <ul> <li> <% lum_out.print( ProjectUtils.someFunction("Mundo") ); %> </li> </ul>

Um erro que pode ocorrer é fazer a inclusão no arquivo /br/com/empresa/style/servico1/estilo.js da seguinte forma:
#lum_include("../commons/utils.js") <ul> <li> <% lum_out.print( ProjectUtils.someFunction("Mundo") ); %> </li> </ul>

Repare que, nesse caso, o #lum_include("../commons/utils.js") está feito fora do bloco de script server-side (<% ... % >). Em determinadas situações, isso pode ser desejável. Nesse exemplo, no entanto, não é, já que o arquivo /br/com/empresa/style/commons/utils.js é puramente um Javascript.
Nesse caso (do erro), o script que o LumisXP montaria seria o seguinte:
let ProjectUtils = { someFunction(param1) { return ` <div> Olá, ${ param1 }! </div> `; } }; <ul> <li> <% lum_out.print( ProjectUtils.someFunction("Mundo") ); %> </li> </ul>

Repare que o código fica errado, já que a variável ProjectUtils não está definida no server-side (onde é utilizada no trecho <% lum_out.print( ProjectUtils.someFunction("Mundo") ); %>).

Suporte a temas

O caminho do arquivo a ser incluso é relativo ao script atual e o caminho do script atual desconsidera o caminho do tema.

Por exemplo, suponha que o script atual está em /br/com/empresa/style/servico1/estilo.js e que se tenha uma inclusão como #lum_include("../commons/utils.js").

Suponha também que na página onde a instância de interface está incluída possua dois temas aplicados: br.com.empresa.projeto.tema1 (localizado em /br/com/empresa/projeto/tema1) e br.com.empresa.projeto.tema2 (localizado em /br/com/empresa/projeto/tema2) (aplicados nessa ordem).

Se o tema br.com.empresa.projeto.tema2 possui dois arquivos (relativos à sua raiz):

/br/com/empresa/style/servico1/estilo.js (ou seja, localizado em /br/com/empresa/projeto/tema2/def/br/com/empresa/style/servico1/estilo.js)
/br/com/empresa/style/commons/utils.js (ou seja, localizado em /br/com/empresa/projeto/tema2/def/br/com/empresa/style/commons/utils.js)

E o tema br.com.empresa.projeto.tema1 possui um arquivo (relativo à sua raiz):

/br/com/empresa/style/commons/utils.js (ou seja, localizado em /br/com/empresa/projeto/tema1/def/br/com/empresa/style/commons/utils.js)

Nessa situação, a referência ao arquivo de estilo /br/com/empresa/style/servico1/estilo.js será resolvida para /br/com/empresa/projeto/tema2/def/br/com/empresa/style/servico1/estilo.js (já que entre os temas aplicados, esse estilo só está disponível no tema br.com.empresa.projeto.tema2).

A inclusão #lum_include("../commons/utils.js") será resolvida utilizando o caminho base do estilo /br/com/empresa/style/servico1/estilo.js.

Logo, o caminho resolvido será /br/com/empresa/style/commons/utils.js.

Uma vez resolvido esse caminho, o LumisXP irá buscar esse arquivo nos temas aplicados (seguindo a ordem de aplicação). No caso, o arquivo resolvido será o /br/com/empresa/projeto/tema1/def/br/com/empresa/style/commons/utils.js (dado que o tema br.com.empresa.projeto.tema1 tem precedência sobre o tema br.com.empresa.projeto.tema2, dada a ordem de aplicação).

Assim, o script final a ser utilizado será composto por:

/br/com/empresa/projeto/tema2/def/br/com/empresa/style/servico1/estilo.js
/br/com/empresa/projeto/tema1/def/br/com/empresa/style/commons/utils.js