Eu me deparei com o mesmo problema.
Em resumo:
- Desejando ter CSS original em um diretório "interno" (Recursos / ativos / css / a.css)
- Desejando ter as imagens no diretório "público" (Resources / public / images / devil.png)
- Desejando que esse galho pegue aquele CSS, recompile-o em web / css / a.css e faça com que aponte a imagem em /web/bundles/mynicebundle/images/devil.png
Eu fiz um teste com TODAS as combinações possíveis (sãs) do seguinte:
- @notação, notação relativa
- Analise com cssrewrite, sem ele
- Imagem de fundo CSS vs tag <img> direta src = para a mesma imagem que CSS
- CSS analisado com assetic e também sem análise com saída direta assetic
- E tudo isso multiplicado tentando um "dir público" (as
Resources/public/css) com o CSS e um diretório "privado" (as Resources/assets/css).
Isso me deu um total de 14 combinações no mesmo galho, e essa rota foi lançada a partir de
- "/app_dev.php/"
- "/app.php/"
- e "/"
dando assim 14 x 3 = 42 testes.
Além disso, tudo isso foi testado funcionando em um subdiretório, então não há como enganar fornecendo URLs absolutos porque eles simplesmente não funcionariam.
Os testes foram duas imagens não nomeadas e, em seguida, divs nomeados de 'a' a 'f' para o CSS criado a PARTIR da pasta pública e nomeados de 'g para' l 'para aqueles criados a partir do caminho interno.
Observei o seguinte:
Apenas 3 dos 14 testes foram mostrados adequadamente nos três URLs. E NENHUM era da pasta "interna" (Recursos / ativos). Era um pré-requisito ter o CSS PUBLIC sobressalente e então construir com o assetic DE lá.
Estes são os resultados:
Resultado lançado com /app_dev.php/
Resultado lançado com /app.php/
Resultado lançado com /
Então ... SOMENTE - A segunda imagem - Div B - Div C são as sintaxes permitidas.
Aqui está o código TWIG:
<html>
<head>
{% stylesheets 'bundles/commondirty/css_original/container.css' filter="cssrewrite" %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{# First Row: ABCDEF #}
<link href="{{ '../bundles/commondirty/css_original/a.css' }}" rel="stylesheet" type="text/css" />
<link href="{{ asset( 'bundles/commondirty/css_original/b.css' ) }}" rel="stylesheet" type="text/css" />
{% stylesheets 'bundles/commondirty/css_original/c.css' filter="cssrewrite" %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{% stylesheets 'bundles/commondirty/css_original/d.css' %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{% stylesheets '@CommonDirtyBundle/Resources/public/css_original/e.css' filter="cssrewrite" %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{% stylesheets '@CommonDirtyBundle/Resources/public/css_original/f.css' %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{# First Row: GHIJKL #}
<link href="{{ '../../src/Common/DirtyBundle/Resources/assets/css/g.css' }}" rel="stylesheet" type="text/css" />
<link href="{{ asset( '../src/Common/DirtyBundle/Resources/assets/css/h.css' ) }}" rel="stylesheet" type="text/css" />
{% stylesheets '../src/Common/DirtyBundle/Resources/assets/css/i.css' filter="cssrewrite" %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{% stylesheets '../src/Common/DirtyBundle/Resources/assets/css/j.css' %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{% stylesheets '@CommonDirtyBundle/Resources/assets/css/k.css' filter="cssrewrite" %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
{% stylesheets '@CommonDirtyBundle/Resources/assets/css/l.css' %}
<link href="{{ asset_url }}" rel="stylesheet" type="text/css" />
{% endstylesheets %}
</head>
<body>
<div class="container">
<p>
<img alt="Devil" src="../bundles/commondirty/images/devil.png">
<img alt="Devil" src="{{ asset('bundles/commondirty/images/devil.png') }}">
</p>
<p>
<div class="a">
A
</div>
<div class="b">
B
</div>
<div class="c">
C
</div>
<div class="d">
D
</div>
<div class="e">
E
</div>
<div class="f">
F
</div>
</p>
<p>
<div class="g">
G
</div>
<div class="h">
H
</div>
<div class="i">
I
</div>
<div class="j">
J
</div>
<div class="k">
K
</div>
<div class="l">
L
</div>
</p>
</div>
</body>
</html>
O container.css:
div.container
{
border: 1px solid red;
padding: 0px;
}
div.container img, div.container div
{
border: 1px solid green;
padding: 5px;
margin: 5px;
width: 64px;
height: 64px;
display: inline-block;
vertical-align: top;
}
E a.css, b.css, c.css, etc: todos idênticos, bastando alterar a cor e o seletor CSS.
.a
{
background: red url('../images/devil.png');
}
A estrutura dos "diretórios" é:
Diretórios
Tudo isso veio, porque eu não queria que os arquivos originais individuais fossem expostos ao público, principalmente se eu quisesse brincar com filtro "menos" ou "atrevimento" ou algo semelhante ... Não queria que meus "originais" fossem publicados, apenas os compilou um.
Mas existem boas notícias . Se você não quiser ter o "CSS sobressalente" nos diretórios públicos ... instale-os não com --symlink, mas realmente fazendo uma cópia. Uma vez que "assetic" construiu o CSS composto, você pode EXCLUIR o CSS original do sistema de arquivos e deixar as imagens:
Processo de compilação
Observe que faço isso pelo --env=prodmeio ambiente.
Apenas algumas considerações finais:
Este comportamento desejado pode ser alcançado tendo as imagens no diretório "public" no Git ou Mercurial e o "css" no diretório "assets". Ou seja, em vez de tê-los em "público", conforme mostrado nos diretórios, imagine a, b, c ... residindo em "ativos" em vez de "público", do que seu instalador / implantador (provavelmente um script Bash ) colocar o CSS temporariamente dentro do diretório "público" antes de assets:installser executado e assets:install, em seguida assetic:dump, automatizar a remoção do CSS do diretório público após a assetic:dumpexecução. Isso atingiria EXATAMENTE o comportamento desejado na pergunta.
Outra solução (desconhecida, se possível) seria explorar se "ativos: instalar" só pode ter "público" como a fonte ou também pode levar "ativos" como uma fonte para publicar. Isso ajudaria quando instalado com a --symlinkopção de desenvolvimento.
Além disso, se vamos fazer o script da remoção do diretório "público", a necessidade de armazená-los em um diretório separado ("ativos") desaparecerá. Eles podem viver dentro do "público" em nosso sistema de controle de versão, pois serão descartados após a implantação para o público. Isso também permite o --symlinkuso.
MAS DE QUALQUER MANEIRA, ATENÇÃO AGORA: Como agora os originais já não existem ( rm -Rf), existem apenas duas soluções, não três. O div de trabalho "B" não funciona mais porque era uma chamada asset () assumindo que havia o ativo original. Apenas "C" (o compilado) funcionará.
Então ... só há um VENCEDOR FINAL: a Div "C" permite EXATAMENTE o que foi solicitado no tópico: Para ser compilado, respeite o caminho para as imagens e não exponha a fonte original ao público.
O vencedor é C
