vue cli 는 절대 경 로 를 사용 하여 그림 문 제 를 참조 합 니 다.
Vue 는 무엇 입 니까?사용자 인 터 페 이 스 를 구축 하 는 점진 적 인 프레임 워 크(홈 페이지 해석)입 니 다.점진 적 인 프레임 워 크 가 무엇 입 니까?간단 한 대답 은 주장 이 가장 적 습 니 다.이런 개념 들 은 자신 만 볼 수 있 고 자신 이 이해 할 수 있 습 니 다.천 명의 독자 가 천 개의 햄릿 에 불과 하지만 많은 해석 입 니 다.Vue 공식 문서전면적 이에 요.
Vue 는 최근 2 년 동안 비교적 핫 한 전단 프레임 워 크(점진 적 프레임 워 크 죠)입 니 다.본 고 는 vue cli 가 절대적 인 경 로 를 이용 하여 이미지 문 제 를 인용 하 는 관련 내용 을 상세 하 게 소개 하고 참고 학습 을 제공 할 것 입 니 다.다음은 더 이상 말 하지 않 겠 습 니 다.한번 봅 시다.
본문:
페이지 에서 절대 경 로 를 사용 하면 js 에서 require()로 도입 할 수 있 습 니 다.
data (){
return {
src: require('IMAGES/banner.jpg')
}
}
<img :src="src">
background: url("/static/images/banner.jpg") no-repeat;그림 자원 을 최적화 할 수 있 기 때문에 그림 자원 을 static 에 두 는 것 은 적합 하지 않 습 니 다.그러나 vue 페이지 style 태그 에 스타일 을 쓰 는 것 은 디 렉 터 리 가 깊 어 지면 서 참조 경 로 는 다음 과 같 습 니 다.
background: url("../../../images/banner.jpg") no-repeat;스타일 파일 을 style 폴 더 에 통일 시 키 고 스타일 이미지 자원 은 상대 적 인 경 로 를 사용 한 다음 style 태그 에 src 속성 으로 스타일 을 도입 하면 너무 많은 반환 을 피 할 수 있 습 니 다~~~
── src
── images
── banner.jpg
── style
── index.scss
/*style*/
background: url("../images/banner.jpg") no-repeat;
<style src="STYLE/index" lang="scss"></style>이상 은 이 글 의 전체 내용 입 니 다.본 논문 의 내용 이 여러분 의 학습 이나 업무 에 어느 정도 참고 학습 가치 가 있 기 를 바 랍 니 다.궁금 한 점 이 있 으 시 면 댓 글 을 남 겨 주 셔 서 저희 에 대한 지지 에 감 사 드 립 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
[Go] 고블렛 고블러스의 통신 게임을 만들어 보았다.굴 사용으로 고블렛 고브라즈라고 하는 보드 게임을 소개하고 있어 매우 재미있을 것 같았기 때문에, Go로 만들어 보기로 했습니다. 방 만들기 서버에 대해, 클라이언트가 폴링을 실시해 게임을 갱신해 갑니다. 앞으로 인...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
