tailwind 적용한 프로젝트가 갑자기 안된다

지자체 대상으로 수행했던 프로젝트인데 어느 날 갑자기 연락이 온다.

'화면이 이상하게 나와요'

바로 웹페이지를 들어갔는데 나는 괜찮다. 뭐지? 수정한 것도 없는데...

원인을 딱 감지하기 어려웠다.
일단 주무관에게 유선으로 '크롬 브라우저 써보고 시크릿 모드로 해보세요.' 했는데 해결이 안되네ㅜ

지금까지 파악한 힌트는 두개다
1. 화면 UI 배치가 이상한 걸 봐서 CSS 쪽
2. 지자체에서만 안되는거보면 외부에서 가져오는 라이브러리 문제

tailwind 문제일 수 있겠다는 생각을 했다.

아니나 다를까 tailwind import 하는 줄을 주석처리하니 내 피씨에서도 동일한 증상이 발현한다.

일단 원인 파악 완료.

그럼 해결해보자

지금 프로젝트 세팅은 npm을 사용할 수 없는 환경이라 tailwind를 cdn으로 가져왔는데 이 cdn 링크가 공공기관의 망에서는 막힌 것 같다.

관련해서 검색해보니 npm을 쓰지 않고 tailwind를 사용하는 것과 관련된 글이 몇 개 있다.

먼저 공식 홈페이지의 글(https://tailwindcss.com/blog/standalone-cli)

서버 사양에 맞는 standalone CLI build 를 다운받는다.

나는 linux x64를 다운받았고 서버로 해당 파일을 옮겼다.

이후에는 이 글(https://cssf1.com/how-to/tailwind-css-without-nodejs-and-npm)을 참고해서 작업했다.

tailwind.conifg.js 파일 만들어서 변환할 대상 파일을 지정해준다.

module.exports = {
    content: [
        './project/**/*.{html,js}',
        './*.php',
    ],
    theme: {
        extend: { },
    },
    plugins: [],
};

그리고 SSH 터미널에서 ./tailwindcss-linux-x64 -i tailwind.css -o tailwind_out.css 입력하니까 딱 된다.

아직 담당 주무관에게 확인은 안받았지만 해결되지 않을까 생각한다.