Tailwind CSS는 자바스크립트로 작성되어 npm 패키지로 배포되기 때문에, 항상 Node.js와 npm이 설치되어 있어야 사용할 수 있었습니다.
이는 npm을 항상 사용하지 않는 프로젝트에 통합하기 어렵게 만들었습니다. 특히 Rails와 Phoenix 같은 도구들이 기본적으로 npm을 사용하지 않는 방향으로 전환하면서, 이러한 프로젝트에서 Tailwind를 사용할 수 있는 방법을 찾아야 했습니다.
오늘 우리는 독립 실행형 CLI 빌드를 발표합니다. 이 빌드는 Node.js나 npm 없이도 Tailwind CLI의 모든 기능을 제공합니다.
시작하기
설치하려면 GitHub의 최신 릴리스에서 여러분의 플랫폼에 맞는 실행 파일을 다운로드하세요. 실행 권한을 부여하는 것을 잊지 마세요:
# Example for macOS arm64curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/latest/download/tailwindcss-macos-arm64chmod +x tailwindcss-macos-arm64mv tailwindcss-macos-arm64 tailwindcss이제 npm으로 배포된 CLI 도구처럼 사용할 수 있습니다:
# Create a tailwind.config.js file./tailwindcss init# Start a watcher./tailwindcss -i input.css -o output.css --watch# Compile and minify your CSS for production./tailwindcss -i input.css -o output.css --minify우리는 모든 퍼스트파티 플러그인의 최신 버전을 번들로 제공합니다. 프로젝트에서 이 플러그인을 사용하려면 Node 기반 프로젝트에서와 마찬가지로 tailwind.config.js 파일에서 require로 불러오면 됩니다.
module.exports = { // ... plugins: [require("@tailwindcss/forms"), require("@tailwindcss/typography")],};여러분은 npm으로 배포된 CLI의 모든 기능을 편리하고 휴대 가능한 패키지로 사용할 수 있습니다. 별도의 의존성은 필요하지 않습니다.
어떻게 동작하나요?
우리는 Tailwind를 Rust로 다시 작성하거나 그런 건 하지 않았습니다 (아직은...). 대신 Vercel의 정말 멋진 프로젝트인 pkg를 사용하고 있습니다. 이 프로젝트는 Node.js 프로젝트를 실행 파일로 변환할 수 있게 해줍니다. 이 실행 파일은 Node.js를 설치하지 않고도 실행할 수 있으며, 프로젝트에 필요한 모든 부분을 실행 파일 자체에 포함시킵니다.
이 덕분에 여러분은 JSON 같은 정적 형식 대신 JavaScript의 모든 기능을 활용할 수 있는 tailwind.config.js 파일을 계속 사용할 수 있습니다.
어떤 CLI를 사용해야 할까요?
여러분의 프로젝트에서 이미 npm을 사용하고 있다면, 우리가 항상 제공해 온 npm 배포 버전의 CLI를 사용하세요. 업데이트가 더 간단하고 파일 크기도 작으며, 이미 해당 생태계에 있기 때문에 독립 실행형 빌드를 사용할 이유가 전혀 없습니다.
반대로 Node.js나 npm이 필요 없는 프로젝트를 진행 중이라면, 독립 실행형 빌드가 훌륭한 선택이 될 수 있습니다. Tailwind 때문에 package.json 파일을 유지해야 했다면, 이 방법이 더 나은 해결책으로 느껴질 것입니다.