[ je개발 일지 ] 70일차, 발표 준비가 한창 (feat. Stroybook Path Error)

---

[ 오늘의 TODO & DONE ]

1. 기타) 회사 발표 준비
   - Stroybook 에러와의 전쟁 (그놈의 Path!!)

---

[ 오늘의 회고 ]

1. 그 놈의 Storybook

  이번에 내가 회사에서 발표하게 된 주제는 Atomic Design 과 Storybook 이다. 이전 발표는 Jest(TDD). 언젠가 개발 복습 블로그에 Jest 와 Atomic Design, Stroybook 을 기재해야 하는데... 오늘은 주말이니까, 그리고 내일은 출근이니까 조금 쉬는 시간을 갖다 보니 나중에 천천히 시간을 갖고 작성하고자 한다. 내용이 방대하다보니 어떻게 정리를 해야할지 걱정도 좀 되기도 하고... Java, Python 복습해야 하는 것들도 있고... 뭐 미래의 내가 어떻게든 공부하겠지

 

  오늘은 Storybook 때문에 시간을 많이 뺏겼다. 현재 webpack 을 webpack.config.js 로 정의를 한 후에 경로를 '~' 사용하면 '../src' 로 지정해놨다. 그런데 Storybook 에서 렌더링할 때 이 '~' 를 인식하지 못하는 문제인 것 같다. 에러의 원인은 알겠는데 이걸 어떻게 해결해야 하는지 방법을 찾기가 어렵다. 내가 원인을 잘못 파악한 걸 수도 있지만, 좀 강력하게 의심은 되긴 한다. 

 

  Storybook 공식 문서에서는 다음과 같은 해결 방안을 내놓고 있다.

 

// .storybook/main.js

// your app's webpack.config.js
const custom = require('../webpack.config.js');

module.exports = {
  webpackFinal: async (config) => {
    return { ...config, module: { ...config.module, rules: custom.module.rules } };
  },
};

 

  당연히 적용해봤고, 당연히 에러가 나서 지금 이렇게 글을 남긴다. 이게 도대체 어떤 문제인가... 무엇이 문제인가.. 

 

 

  결국, 오늘까지 해결은 하지 못했다... 정말 이런 config 지정은 왜 어려운가. 내가 해결해야하는 내 문제점이다. 조금 더 공식문서와 깃헙 주소를 보고 해결 방안을 찾아봐야 할 것 같다.