나는 매우 똑같은 문제를 만났습니다.
요컨대 :
- "내부"디렉토리 (Resources / assets / css / a.css)에 원본 CSS를 보유하고자 함
- "공개"디렉토리 (Resources / public / images / devil.png)에 이미지를 포함 할 의사가 있음
- 해당 나뭇 가지가 해당 CSS를 가져 와서 web / css / a.css로 다시 컴파일하고 /web/bundles/mynicebundle/images/devil.png의 이미지를 가리 키도록합니다.
다음의 가능한 모든 (정상적인) 조합으로 테스트했습니다.
- @ 표기법, 상대 표기법
- cssrewrite로 구문 분석하지 않고
- CSS 이미지 배경과 직접 <img> 태그 src =를 CSS와 매우 동일한 이미지로
- assetic으로 구문 분석되고 자산 직접 출력으로 구문 분석하지 않고 CSS
- 그리고이 모든 것은
Resources/public/cssCSS와 함께 "public dir"(as )와 "private"디렉토리 (as Resources/assets/css) 를 시도함으로써 곱해졌습니다 .
이것은 나에게 동일한 나뭇 가지에 총 14 개의 조합을 제공했고,이 경로는
- "/app_dev.php/"
- "/app.php/"
- 및 "/"
따라서 14 x 3 = 42 테스트를 제공합니다.
또한이 모든 작업은 하위 디렉토리에서 테스트되었으므로 절대 URL이 작동하지 않기 때문에 절대 URL을 제공하여 속일 방법이 없습니다.
테스트는 두 개의 이름이 지정되지 않은 이미지 였고 공용 폴더에서 빌드 된 CSS에 대해 'a'에서 'f'로 이름이 지정된 div, 내부 경로에서 빌드 된 이미지에 대해 'g에서'l '로 이름이 지정되었습니다.
나는 다음을 관찰했다 :
14 개의 테스트 중 3 개만이 3 개의 URL에 적절하게 표시되었습니다. 그리고 NONE은 "내부"폴더 (Resources / assets)에서 왔습니다. 여분의 CSS PUBLIC을 가지고 거기에서 assetic FROM으로 빌드하는 것이 전제 조건이었습니다.
결과는 다음과 같습니다.
/app_dev.php/로 시작된 결과
/app.php/로 시작된 결과
/로 시작된 결과
그래서 ...-두 번째 이미지-Div B-Div C는 허용되는 구문입니다.
다음은 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>
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;
}
그리고 a.css, b.css, c.css 등 : 모두 동일하며 색상과 CSS 선택기를 변경하기 만하면됩니다.
.a
{
background: red url('../images/devil.png');
}
"디렉토리"구조는 다음과 같습니다.
디렉토리
이 모든 것은 개별 원본 파일이 공개되는 것을 원하지 않았기 때문에, 특히 "덜"필터 나 "sass"또는 이와 유사한 것으로 재생하고 싶을 때 ... "원본"이 게시되는 것을 원하지 않았습니다. 컴파일 된 하나.
그러나 좋은 소식이 있습니다. 공용 디렉토리에 "예비 CSS"를 사용하지 않으려면 ...로 설치하지 --symlink말고 실제로 복사본을 만드십시오. "assetic"이 복합 CSS를 구축하고 나면 파일 시스템에서 원본 CSS를 삭제하고 이미지를 그대로 둘 수 있습니다.
편집 과정
참고 --env=prod환경을 위해이 작업을 수행 합니다.
몇 가지 마지막 생각 :
이 원하는 동작은 Git 또는 Mercurial의 "public"디렉토리에 이미지 를, "assets"디렉토리에 "css"를 두면 달성 할 수 있습니다 . 즉, 디렉토리에 표시된대로 "공용"에있는 대신 설치 프로그램 / 배포자 (아마도 Bash 스크립트)가 있는 것보다 "공용"대신 "자산"에 상주하는 a, b, c ...를 상상해보십시오. CSS를 assets:install실행 하기 전에 "public"디렉토리에 임시로 넣은 다음 assets:install, 그런 다음 실행 된 assetic:dump후 공용 디렉토리에서 CSS 제거를 자동화합니다 assetic:dump. 이것은 질문에서 원하는 행동을 정확하게 얻을 수 있습니다.
가능한 경우 알 수없는 또 다른 해결책은 "assets : install"이 "public"을 소스로만 사용할 수 있는지 아니면 "assets"를 게시 할 소스로 사용할 수 있는지 탐색하는 것입니다. --symlink개발할 때 옵션 과 함께 설치하면 도움이됩니다 .
또한 "공용"디렉토리에서 제거하는 스크립트를 작성하면 별도의 디렉토리 ( "자산")에 저장할 필요가 없어집니다. 공개적으로 배포 할 때 삭제되므로 버전 관리 시스템의 "공개"내에있을 수 있습니다. 이것은 또한 --symlink사용을 허용 합니다.
그러나 어쨌든, 지금주의 : 이제 원본은 더 이상 존재하지 않습니다 (rm -Rf ), 3 개가 아닌 2 개의 솔루션 만 있습니다. 작업 div "B"는 원래 자산이 있다고 가정하는 asset () 호출이므로 더 이상 작동하지 않습니다. "C"(컴파일 된 것) 만 작동합니다.
따라서 ... 최종 우승자 만 있습니다. Div "C"는 주제에서 요청한 내용을 그대로 허용합니다. 컴파일하려면 이미지 경로를 존중하고 원본 소스를 대중에게 공개하지 마십시오.
승자는 C
