회고록에 기술적으로 막힌걸 적으라는데, 왜 막힌건지 모르겠다.

설탕유령·2022년 7월 25일
0
post-custom-banner

글 하나 쓰려고 하면 기본적으로 한시간이 사라진다.
만약 기술적인 것을 정리한 글이라면 2~3시간이 사라진다.
문제는, 그렇게 써놓은 글을 나중에 다시 바라보면,
'아니 왜 이딴거 쓰는게 몇시간이 걸리지?'
라는 생각이 든다.

물론 통계의 오류다
내가 검색해서 나오는 기술적인 글들은 다양하게 쓰여진 글들 중에서 조회수가 높고 인기가 많은 글을 주로 보게 된다.
그러한 글들과 내 글을 비교하면 그건 오만한 것일거다....

물론 욕심은 나고 아쉬움은 그대로지만, 아무튼 글도 글이지만 기술적인 것도 포함이다
React 이야기지만 얼마전에 svg 파일을 컴포넌트화 시켜서 사용하려고 한적이 있다.
import { ReactComponent as User } from '@icon/user.svg';
ReactComponent를 이용해 컴포넌트화 시키면, 내부에 변수를 전달해 색상이나 모양 style 등을 자유롭게 바꿀 수 있다.
다만 컴포넌트화 기능을 그냥 지원해 주는건 아니다.
나는 custom.d.ts 이라는 커스텀 파일을 만들고 *.svg 파일에 대해서 별도의 선언을 했다.

declare module '*.svg' {
  import React = require('react');
  export const ReactComponent: React.FC<React.SVGProps<SVGSVGElement>>;
  export default src;
}

다만 문제가 생겼다
Vite라는 번들링(대충 빌드라고 생각하면 됨) 라이브러리를 사용하는데, 해당 라이브러리 내부적으로 svg 파일에 대한 별도의 선언이 이미 되어있었다.
즉 라이브러리의 내용과 내 선언이 충돌을 일으켰다.

당시에 나는 이 문제를 해결하려고 거의 하루의 절반을 소비했다.
다양한 자료를 찾고, 라이브러리를 교체해보고, 방식을 바꿔가면서 하루를 보냈다
정 안되니깐 다른거 하다가 다시 돌아와서 해보기까지 했다.

해결은 너무나 쉬웠는데, 그냥 곂치는 부분을 제거하면 됬다
export default src;
선언을 했지만, src로 내보내려 하면 서로 충돌이 일어나기에 src로 내보내는 부분을 그냥 지워버렸다

전날 몇시간 동안 이 문제로 고민하다가, 다음날 아침에 보고 10분도 안되서 해결된 문제였다.
'왜 이딴거에 시간을 소비한거지?'
필요한 일이었지만, 날아간 시간을 보내 마음 한켠이 아려온다.

막상 그때는 치열했던 것 같은데, 돌아보니 볼품없고,
저 앞에 먼저 가고 있는 사람들이 남기는 것들은 저마다의 의미가 있어 보인다.
그럴 때면 왠지, 내가 재능이 없나 미련이 들면서도 다른 길이 없기에 그저 걷는 내가 초라해 보인다.

profile
달콤살벌
post-custom-banner

0개의 댓글