저는 현재 Twig 및 Tailwind CSS를 사용하여 Symfony 6 프로젝트를 진행하고 있습니다.

이 가이드의 모든 항목을 여기에 설치했습니다. https://tailwindcss.com/docs/guides/symfony

저는 (일부) tailwind CSS 요소를 사용할 수 있었고 Webpack Encore는 PostCSS를 통해 필요한 tailwind 구성을 로드하고 public/build/ 디렉터리에 자산을 구축했습니다.

base.html.twig가 빌드 리소스를 로드합니다

base.html.twig

드디어 index.html.twig(base.html.twig를 확장함)에서 사용할 수 있습니다.

보시다시피 예시 제목과 이미지에 tailwind 속성을 적용해보았습니다. 그러나 헤더와 관련된 tailwind CSS 속성은 작동하지만 이미지에는 작동하지 않습니다. 브라우저에서 확인해도 해당 속성에 대한 CSS 값이 표시되지 않습니다. 내 이미지를 더 작게 만들고 테두리를 다음과 같이 만들고 싶습니다.

결과는 다음과 같습니다.