23.01.26) Typescript 프로젝트 글 작성 기능을 작업한 61일차

오류

Module not found: Error: You attempted to import ../../img/basicImg.png which falls outside of the project src/ directory. Relative imports outside of src/ are not supported.
You can either move it inside src/, or add a symlink to it from project's node_modules/.

이미지 파일들이 있는 assets 폴더를 src 폴더 바깥의 public 폴더에서 src 폴더 내부로 이동시킴으로써 이슈를 해결

-> 이라 적혀 있었지만 나는 src폴더에 이미지 파일을 넣어놨다...왜 안될까 결국 이미지대신 백그라운드 컬러로 대신해 오류 임시 해결...

문제 원인

1. 이미지 태그에 src속성으로 바로 설정

2. 맨 상단에서 이미지 자체 import

3. css 파일에서 backgound-imgae로 사용

그리고 와중  img를 가져오는 style components쪽의 오류가 발생

원인은 props로 가져오는 이미지 스타일 속성의 타입 오류.

<{ background: any }>주어 해결했다.

const ProfilePhoto = styled.div<{ background: any }>`
  background-image: url(${(props) => props.background});
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  cursor: pointer;
  width: 50px;
  height: 50px;
  border-radius: 100%;
`;

 

나머지는 type오류나...props로 인한 오류였다..엉엉..

 

작업 진행 상황

• 글 작성 페이지
• 글 수정 페이지[진행중]