본문 바로가기

web/기타6

[CSS] 자식 요소보다 height가 1~2px 늘어나는 경우 SVG를 로 감쌌을 때 height가 1~2px 정도 늘어나는 이유는 SVG가 기본적으로 인라인 요소로 취급되기 때문입니다. 이로 인해 인라인 요소의 특성인 베이스라인(baseline)과 관련된 여백이 추가될 수 있습니다. 이를 해결하려면 SVG를 블록 요소로 변환하거나, 부모 의 스타일을 조정하여 이러한 여백을 제거할 수 있습니다.다음은 이를 해결하는 몇 가지 방법입니다:방법 1: SVG를 블록 요소로 설정SVG를 블록 요소로 설정하여 베이스라인 여백을 제거할 수 있습니다.  방법 2: 부모 의 라인 높이 설정부모 의 line-height를 0으로 설정하여 추가 여백을 제거할 수 있습니다.  방법 3: vertical-align 속성 설정SV.. 2024. 11. 10.
npm EACCES permissions errors 해결 방식sudo로 설치하거나 chown명령어로 권한 변경npm 기본 디렉토리를 수동으로 변경⇒ 위 방법 대신 nvm을 이용해서 npm 재설치 하기nvm 설치https://github.com/nvm-sh/nvm#introcurl -o- | bash환경변수 설정vim ~/.zshrcexport NVM_DIR="$([ -z "${XDG_CONFIG_HOME-}" ] && printf %s "${HOME}/.nvm" || printf %s "${XDG_CONFIG_HOME}/nvm")"[ -s "$NVM_DIR/nvm.sh" ] && \\. "$NVM_DIR/nvm.sh" # This loads nvmnvm으로 node 설치nvm install 18.20.4// 기본 버전 설정nvm alias default.. 2024. 11. 9.
npm에서 yarn berry로 Migration to yarn berry 최근에 팀원이 yarn berry를 도입하자고 해서 마이그레이션을 시작했습니다. 빌드 시간을 단축할 수 있고 다른 회사들도 사용한다하여 좋나보다 하고 지나갔습니다. 그러한 무지 상태에서 작업을 하니 도중에 문제가 발생했습니다. 프로젝트 코드에서 의존성 명시 없이 라이브러리를 사용하고 있었는데 yarn berry로 마이그레이션을 하고 빌드를 하니 의존하지 않는 패키지에 접근하고 있다는 오류가 뜬 것 입니다. 아래에서 정리하겠지만 기존 npm 프로젝트에서는 유령 의존성에 의해 특정 패키지가 접근이 가능합니다. yarn berry로 넘어오니 접근이 안되는 게 불편하게 느껴졌습니다. 또한 마이그레이션 작업을 할 때 명시 하지 않은 패키지를 자동으로 추가해주는 방법이 없.. 2022. 11. 9.
[Vue] vue-fragment 사용 시 발생하는 DOM Exception 해결 vue component는 하나의 root element를 가져야 한다. 따라서 다중 element가 있는 경우 하나로 감싸주기 위해서 태그를 사용하거나 vue-fragment 패키지를 사용할 수 있다. 태그로 감싸서 신나게 작업을 하다보면 다음과 같은 오류를 만날 수 있다. [Vue warn]: Error in nextTick: "NotFoundError: Failed to execute 'insertBefore' on 'Node': The node before which the new node is to be inserted is not a child of this node.” DOMException: Failed to execute 'insertBefore' on 'Node': The node be.. 2022. 2. 28.
빌드(build), 메이븐과 라이프 사이클 컴파일이란? 소스코드를 컴퓨터가 이해하는 기계어(바이너리코드)로 변환하는 과정 자바의 경우는 jvm에서 실행할 수 있는 바이트코드의 클래스 파일이 생성됨 빌드란? 소스코드를 실행할 수 있는 소프트웨어 형태로 변환하는 과정 → 소스코드(java)나 프로젝트 리소스(.xml, .jpg, ...)를 jvm이나 was(톰캣)이 인식할 수 있는 구조로 패키징 하는 과정 소프트웨어가 응집력 있는 하나의 단위로써 작동하게 하는 과정 (테스트, 검사, 배포 기능등을 포함하는 단위로 생각하기도 함) 빌드 툴 프로젝트 생성, 테스트 빌드, 배포 등 전체적인 라이프 사이클을 관리하기 위한 전용 프로그램 엔터프라이즈 개발시 일어나는 빈번한 라이브러리 추가 및 버전 동기화의 어려움을 해소 코드 컴파일, 컴포넌트 패키징, 개발 .. 2021. 7. 8.
[WEB] WEB과 HTTP, URI와 URL 개념 목차 WEB 인터넷과 웹 웹의 구성요소 HTTP HTTP 특징 HTTP Method HTTP Status Code HTTP Message Format URI URL 구조 WEB 인터넷 전세계 컴퓨터를 하나로 연결하는 거대한 네트워크를 의미한다. 이러한 인터넷을 활용한 서비스로 WWW, E-Mail, FTP, Telnet 등이 있다. Web (World Wide Web) 인터넷을 활용해 HTML로 만들어진 페이지를 컴퓨터가 주고 받을 수 있도록 고안된 서비스이다. 웹은 텍스트, 이미지, 음성, 영상 등 다양한 미디어를 HyperText 방식으로 연결하여 제공한다. ** Hyper Text 초월적 텍스트. 정보에 대한 순차적 접근이 아닌 비순차적인 접근을 뜻한다. 같은 페이지 내의 위치 이동이나 다른 페이지.. 2020. 11. 24.