스토리북 아이콘 이미지 표기 오류

[BoBeenLee]

Issue

• 경로가 절대경로이기 https://bobeenlee.github.io/bbl-nx/ui-components/ 기준이 아닌 https://bobeenlee.github.io/ 기준으로 이미지를 가져오고 있기에 문제가 발생하였습니다.

Solution

1. storybook환경일 경우 /bbl-nx/ui-components prefix를 붙여 이미지 절대경로 자원을 찾을 수 있게 변경한다.
2. https://bobeenlee.github.io/ 기준으로 assets 경로 설정을 하여 이미지를 가져올 수 있게 한다.
   • https://storybook.js.org/docs/react/configure/images-and-assets#serving-static-files-via-storybook-configuration

2번 방안이 가장 깔끔하지만 storybook설정 삽질을 좀해야될듯 싶다.

[BoBeenLee]

2번일 경우 시도해보았으나 chromatic 웹팩 빌드시 경로를 찾지 못하고 실제로 github pages 스토리북 웹팩 빌드시 적용이 안되는 이슈가 있습니다. 그런 이유로 1번 솔루션을 이용하여 해결하였습니다.

• 이미지 모듈내 prefix 설정 variables를 추가하여 storybook일 경우에만 .env를 받아 prefix 설정하여 이미지 path 구성합니다.