>  기사  >  웹 프론트엔드  >  Symfony 2 프로젝트 내 CSS 파일의 자산을 올바르게 참조하는 방법은 무엇입니까?

Symfony 2 프로젝트 내 CSS 파일의 자산을 올바르게 참조하는 방법은 무엇입니까?

Patricia Arquette
Patricia Arquette원래의
2024-11-16 06:06:02955검색

How to Correctly Reference Assets in CSS Files Within a Symfony 2 Project?

Symfony 2의 CSS 파일에 있는 자산 경로

Symfony 2는 다음을 통해 CSS 및 이미지 파일과 같은 자산을 관리하는 메커니즘을 제공합니다. 자산 구성 요소. 그러나 특정 프로젝트 디렉터리 구조에서는 CSS에서 참조 자산에 대한 올바른 경로를 지정하는 것이 어려울 수 있습니다.

문제 개요

다음 디렉터리 구조를 고려하세요.

...
+-src/
| +-MyCompany/
|   +-MyBundle/
|     +-Resources/
|       +-assets/
|         +-css/
|           +-stylesheets...
+-web/
| +-images/
|   +-images...
...

이 경우 CSS 파일은 /app/Resources/assets/css에 있고 이미지는 /web/images에 있습니다. 목표는 CSS 파일 내에서 이러한 이미지를 참조하는 것입니다.

실패한 솔루션

첫 번째 솔루션: 절대 경로

CSS 파일의 경로를 절대 URL로 변경하는 것은 애플리케이션이 항상 루트 디렉터리에서 실행되지 않을 수 있으므로 실행 가능한 솔루션이 아닙니다.

두 번째 솔루션: CSSrewrite 필터를 사용하는 Assetic

생성된 코드가 이미지에 대한 올바른 경로를 생성하지 않기 때문에 "cssrewrite" 필터와 함께 Assetic을 사용하는 것도 실패합니다.

현재 솔루션: 상대 경로

이미지 정의 CSS 파일과 관련된 경로는 프로덕션 환경에서는 작동하지만 개발 환경에서는 작동하지 않습니다.

작업 솔루션

가장 효과적인 솔루션은 CSS 파일을 공개적으로 액세스 가능한 디렉터리를 만들고 배포 중에 CSS를 다시 빌드하세요. 작동 방식은 다음과 같습니다.

  1. CSS 파일을 Resources/public/css로 이동합니다.
  2. 공용 디렉터리의 CSS 파일을 참조하도록 Twig 템플릿을 업데이트합니다.
  3. assets:install --symlink 명령을 사용하여 적절한 위치에 공용 CSS 파일에 대한 심볼릭 링크를 만듭니다.
  4. 배포하는 동안 공용 디렉터리에서 원본 CSS 파일을 제거하고 심볼릭 링크만 남겨 둡니다.

이 접근 방식을 사용하면 배포 중에 CSS 파일이 다시 컴파일되어 이미지에 대한 올바른 경로가 포함되도록 합니다. 이미지 자체는 여전히 web/images 디렉토리에 있지만 사용자가 직접 액세스할 수는 없습니다.

위 내용은 Symfony 2 프로젝트 내 CSS 파일의 자산을 올바르게 참조하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.