🚨 에러 발생Error: attribute height: Expected length, "auto". 🧨 문제 상황svg 파일에 width, height를 current로 설정해뒀는데 import하여 사용할 때 아래처럼 width에 값을 주고 height를 auto로 설정했더니 이런 에러가 떴다.// icon svg// component svg 파일에서 height를 auto로 바꿔보기도 했지만 문제는 여전했다.height를 auto로 설정해서 생긴 문제인데 아이콘이 정사각형인 경우면 height를 width와 똑같이 지정하면 되지만, 직사각형인 경우에는 width를 지정한 후에 height를 몇으로 줘야 할지 알 수 없었다. 🚔 해결 방법이전까지는 svg 파일에서 width, height를 커스..

HTML에서 JavaScript를 포함할 때 script 태그를 사용한다. 이 script 태그가 어디에 위치하느냐에 따라 조금씩 차이점이 있는데 이를 알아보도록 하자! 1. head 태그 안에 script 태그 포함 head 태그 안에 script 태그를 포함할 경우, HTML을 파싱하다가 멈추고 JavaScript 파일을 먼저 다운받는다. JavaScript를 다 다운받으면 실행한 후 그 이후에 HTML을 마저 파싱한다. 단점: 자바스크립트 용량이 커서 다운로드가 오래 걸리면 그동안 뒤의 HTML이 파싱되지 않기 때문에 페이지 로드가 느려진다. 2. body 태그 마지막에 script 태그를 포함 1번의 문제점을 해결할 수 있는 방법이다. script 태그를 body의 마지막에 포함하게 되면, HTM..

vsc로 웹 개발 코딩할 때 도움되는 익스텐션 추천 1. Live Server 크롬에 html 파일 경로를 치면 웹 페이지로 볼 수 있는데, 이는 파일에 변경사항이 있을 때마다 새로고침해줘야 한 Live Server를 install하면 vsc 우측 하단에 Go Live 버튼이 뜬다 Go Live 버튼을 누르면 새로고침하지 않아도 파일을 저장하자마자 웹에서도 변경사항이 반영된다 2. Live Preview 돋보기를 누르면 실시간으로 vsc에서 미리보기할 수 있다 3. Material Theme 다양한 vsc 테마 제공 Set Color Theme 버튼을 누르면 다른 테마로 변경할 수 있다 4. Material Icon Theme vsc에서 뜨는 파일 아이콘 테마 html, css, js...등 파일명 우측..