트러블 슈팅 - 새로 만든 환경에서 tailwind가 적용 안됨

개요

기존 레거시 코드는 styled component를 사용했지만,
현재 모노레포는 tailwind를 사용하고 있음.

그러나 새로 만든 프로젝트에서는 tailwind가 적용되지 않음.

고민

• 개발자도구의 네트워크탭에서 확인해보니
  • _next/dasfadf.css?v=12312312 이런 곳으로의 접근이 포트포워딩이 안되는 문제가 있었음.
• 이유
  • nginx 설정을 통해 특정 경로의 페이지를 다른 포트에 띄워져 있는 웹서버의 페이지로 라우팅 하기
  • 이 글에서 나와있듯이
    1. domain.com 접속 시 기본으로 nginx에서 localhost:3000으로 프록시 패스함
    2. 아래의 경우 33000으로 프록시 패스 함
       • localhost:3000/pc/counselors

    • localhost:3000/pc/counselor?id=[number] 로 접근하는 경우

    • localhost:33000/care/counselors

    • localhost:33000/care/counselor?id=[number]

  • 3000과 33000은 둘다 next이고, 각각 다른 _next를 빌드된 파일 디렉토리로 가지고 있음
  • 이때 어떻게 해결할 수 있을까?

해결

• assetPrefix를 사용하여 모든 일본 웹은 care라는 prefix를 붙이도록 수정함.
  • 이름 더 단순화, 구조화하여 mcg(mind care global)
    • mcg