tailwind의 빌드 파일을 보면 코드가 상당히 많다.

18만줄...

18만줄 올려버려도 딱히 문제는 없지만, 워낙 무겁기도하고, github에 이대로 올리면 코드 비율의 80%를 css가 차지해버리기 때문에, 사람들에게 프로젝트를 소개할 때 spring 개발이라고 주장해도 사람들이 절대 안 믿어주는 문제가 생길 수도 있다.

때문에 지금부터 tailwind 빌드 파일 코드양을 줄여볼 것이다.

tailwind.config.js 설정

purge 속성만 하나 넣어주면 된다.

/** @type {import('tailwindcss').Config} */
module.exports = {

// 실제 사용중인 클래스들만 컴파일
//    purge: {
//        enabled: true,
//        content: ["../templates/thymeleaf/**/*.html"],
//      },

// 모든 클래스 컴파일
  content: ["../templates/thymeleaf/**/*.html"],




  theme: {
    extend: {},
  },
  plugins: [],
}

이런식으로 해주면 경로에 있는 템플릿들이 실제로 사용하고 있는 클래스들만 추려서 빌드해서 output을 내준다.

적어도 18만줄까지 나오지는 않기 때문에 라이브러리 코드가 매우 가벼워지는 장점이 있다.

개발과정에서는 어떤 클래스를 사용할지 모르니까 그냥 싹 다 빌드해서 만들어놓고, 완성해서 배포 할 때는 추려서 purge를 해서 빌드해서 쓰면 될 듯하다.