빌드 시 css관련 unknown word 에러 해결(tailwindCSS, Vercel)

Vercel에서 배포 과정에서 빌드 시 이러한 오류를 만났습니다
CSS 최소화(CSS Minimizer) 플러그인이 오류를 발견했다는 내용이었으며 특정 문자에 문제가 있다는 내용이라는 것을 확인하였습니다.

하지만 로컬에서 어플은 정상 작동하였고... tailwindCSS를 적용한 컴포넌트에 문제가 있나 전부 확인해봤지만 이상이 없었습니다.

그러다 문득 stackoverflow에서 비슷한 글을 보았고 tailwindCSS 커스텀 설정 중 세미콜론(;)을 입력할 경우 빌드 시 오류가 난다는 것을 확인하였습니다.
https://stackoverflow.com/questions/73923945/csssyntaxerror-unknown-word-in-tailwind-and-next-js-project

theme: {
	extend: {
    	boxShadow: {
        	custom:
          		'rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 2px 6px 2px;',
        }  
    }
}

프로젝트에서 tailwindCSS 설정을 찾아보니 box-shadow 설정 관련하여 외부에서 가져오다가 세미콜론이 있었다는 것을 확인했고 지웠더니 빌드에 성공하였습니다...!

tailwindCSS 커스텀 설정 시 조심하시길!