Rails 4 이미지 경로, 이미지 URL 및 자산 URL이 더 이상 SCSS 파일에서 작동하지 않습니다.


99

image-urlRails 4에서 다른 것을 제외 하고 다른 것을 사용해야 합니까? 말이 안되는 다른 값을 반환합니다. 내가 가지고있는 경우 logo.png/app/assets/images/logo.png내가 다음을 수행, 이것은 내가 무엇을 얻을 수 있습니다 :

image-url("logo.png") -> url("/images/logo.png") #obviously doesn't work
image-path("logo.png") -> "/images/logo.png"
asset-url("logo.png") -> url("/logo.png")

물론 이러한 작업은 적어도 /assets앞에 필요하기 때문에 작동하지 않습니다 .

업데이트 : 사실, 방금 Rails 4에서 이미지에 액세스하려면 어떻게해야합니까? 에 이미지가/app/assets/images/logo.png있습니다. 그러나 다음 URL 중 하나로 이동하면 여전히 내 이미지가 표시되지 않습니다.

http://localhost:3000/assets/logo.png
http://localhost:3000/assets/images/logo.png
http://localhost:3000/logo.png
http://localhost:3000/images/logo.png

업데이트 2 : 내가 가져올 수있는 유일한 방법logo.png/app/assets/stylesheets디렉토리로 이동한 다음가져 오는것입니다.

http://localhost:3000/assets/logo.png

이것을 시도하십시오 :asset_path("logo.png", image)
Marcelo De Polli

@depa-단순히 "/logo.png"로 변환되어 내 이미지가 표시되지 않습니다.
at.

3
.css파일 내부 또는 파일에서 해당 도우미를 사용하고 .css.scss있습니까?
Marcelo De Polli 2013 년

@depa-도우미를 사용하지 않습니다. 나는이 그냥 폴더 내 이미지를 위해 작동하지 않는 자산의 더 큰 문제라고 생각
에.

1
@depa-오, 당신이 무엇을 요구하는지 알았습니다. .css.scss파일 안에 있습니다
at.

답변:


113

이 문제가 직접 발생했습니다. 도움이 될만한 3 가지 사항 :

  • app/assets/images디렉토리에 이미지를 배치 하면 경로에 접두사없이 직접 이미지를 호출 할 수 있어야합니다. 즉.image_url('logo.png')
  • 자산을 사용하는 위치에 따라 방법에 따라 다릅니다. background-image:속성 으로 사용하는 경우 코드 줄은 background-image: image-url('logo.png'). 이는 less 및 sass 스타일 시트 모두에서 작동합니다. 뷰에서 인라인으로 사용하는 경우 image_tag레일에 내장 된 도우미 를 사용 하여 이미지를 출력해야합니다. 다시 한 번 접두사 없음<%= image_tag 'logo.png' %>
  • 마지막으로 자산을 사전 컴파일하는 경우 자산 rake assets:precompile을 생성하기 위해 실행 하거나 rake assets:precompile RAILS_ENV=production프로덕션을 위해 실행 합니다 . 그렇지 않으면 프로덕션 환경에 페이지를로드 할 때 지문이 생성 된 자산이 없습니다.

또한 포인트 3의 명령에 대해 bundle execbundler를 실행하는 경우 접두사를 붙여야합니다 .


1
또 다른 요점은 설명서 guides.rubyonrails.org/asset_pipeline.html 을 읽는 입니다. 이미지가로드되는 경우 브라우저의 웹 개발자 디버그에서도 볼 수 있습니까?
H.Rabiee 2013

3
이제 이것이 답을 쓰는 방법입니다. 각 시나리오. "만약"을 예측하면 느슨한 끝이 없습니다. "전투를 본"(정말 문제를 해결 한) 사람의 표시.
ahnbizcad 2014

나는 여러 번 RAILS_ENV = production 누락에 물려 왔습니다.
Sixty4Bit 2016 년

62

첫 번째 공식 image_url('logo.png')은 정확합니다. 이미지가 발견되면 경로 /assets/logo.png(프로덕션의 해시 포함)를 생성합니다. 그러나 Rails가 사용자가 이름을 지정한 이미지를 찾지 못하면 /images/logo.png.

다음 질문은 Rails가 이미지를 찾지 못하는 이유입니다. app / assets / images / logo.png에 넣으면으로 이동하여 액세스 할 수 있습니다 http://localhost:3000/assets/logo.png.

작동하지만 CSS가 업데이트되지 않으면 캐시를 지워야 할 수 있습니다. tmp/cache/assets프로젝트 디렉토리에서 삭제 하고 서버 (webrick 등)를 다시 시작합니다.

이것이 실패하면 background-image: url(logo.png);CSS가 동일한 상대 경로 (이 경우 / assets)를 가진 파일을 찾도록합니다.


2
이 문제를 해결하기 위해 작은 따옴표 대신 이미지 경로에 큰 따옴표를 사용하여 물 렸습니다. css / scss 파일의 자산 도우미와 함께 작은 따옴표를 많이 사용합니다.
d_ethier 2014

나는 "정의되지 않은 지역 변수 또는 메소드 '이미지'"무엇입니까
무하마드 Umer

단어 이미지 앞에 실수로 공백을 넣을 수 있습니까?
닉 도시

10

asset_url헬퍼를 사용 하면 문제를 해결할 수 있다는 것을 방금 알아 냈습니다 .

asset_url("backgrounds/pattern.png", image)

undefined local variable or method 'image'오류 가 발생했습니다.
Penguin

레일에서 뭔가 변경되었을 수 있습니다.이 답변은 오래되었습니다! 당신이 시도 할 수asset_path("<your_path>", type: :image)
Leftis

8

인라인 CSS로 배경 이미지를 추가하려고 시도하면서 비슷한 문제가 발생했습니다. 자산 동기화가 작동하는 방식으로 인해 이미지 폴더를 지정할 필요가 없습니다.

이것은 나를 위해 일했습니다.

background-image: url('/assets/image.jpg');

고마워, 내가하고 있었 assets/img.jpg거나 ../assets/img.jpg분명히 어떤 디렉토리에서도 작동하지 않습니다. /assets/img.jpg않습니다. TY
ElliotM 2017-06-26

5

Rails 4.0.0은 image-urlcss 파일과 동일한 디렉토리 구조에 정의 된 이미지를 찾습니다 .

당신의 CSS에서 예를 들어 assets/stylesheets/main.css.scss, image-url('logo.png')이된다 url(/assets/logo.png).

당신이 당신의 CSS 파일을 이동하면 assets/stylesheets/cpanel/main.css.scss, image-url('logo.png')이된다 /assets/cpanel/logo.png.

assets / images 디렉토리에서 직접 이미지를 사용하려면 다음을 사용할 수 있습니다. asset-url('logo.png')


5

스타일 시트 : url (asset_path ( 'image.jpg'))


3
url(asset_path('image.jpg'), url('image.jpg')및 의 주요 차이점은 무엇입니까 image-url('image.jpg')? 저는 Rails 5.0.0.1url()작업하고 있으며 SCSS 파일과 제가 사용하는 html.erb 파일 에서 잘 작동 asset_path()하므로 올바른 방법을 알고 싶습니다. 미리 감사드립니다.
alexventuraio

asset_path이미지 파일에 다이제스트 부록을 추가하십시오. 실제로 프로덕션을위한 것이며 배포 할 때마다 요약 부록이 변경되고 사용자의 브라우저가 새 버전의 이미지를 다운로드합니다.
Alex Kojin
당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.