Sapper 및 Svelte가 포함된 TailwindCSS

뭐 ?

Sapper 0.28.0, Svelte 3.17.3 및 Tailwind CSS 1.8.6이 포함된 초기 템플릿이 2020년 9월 25일로 업데이트됨

왜요 ?

많은 게시물과 참조 작업이 있지만 이전 버전이 있기 때문입니다. 이것은 더 새로운 버전을 사용하려고 하는 또 다른 대안일 뿐입니다.

어떻게 ?

다음 명령을 실행합니다.

npx degit csaltos/sapper-svelte-with-tailwindcss app1
cd app1
npm i
npm run dev

그리고 http://localhost:3000에서 브라우저를 열어 Tailwind CSS 샘플을 사용하여 Svelte로 수행한 Sapper 페이지를 확인합니다.

어디에 ?

https://github.com/csaltos/sapper-svelte-with-tailwindcss에서 Svelte 템플릿이 있는 원본 Sapper를 기반으로 하는 참조로 소스 코드를 찾을 수 있습니다.

Tailwind CSS를 활성화하기 위한 정확한 변경 사항이 포함된 커밋dc251b6에 특히 주의하십시오.

누구 ?

이 템플릿은 다음의 많은 게시물과 참조 덕분에 가능합니다.

https://github.com/dan-unhuman/sapper-template-rollup-tailwind (이 버전 2에서 사용된 이 멋진 솔루션에 대해 dan에게 특별히 감사드립니다)

https://www.apostrof.co/blog/getting-tailwind-css-to-integrate-nicely-with-svelte-sapper/

https://github.com/tailwindlabs/tailwindcss-setup-examples/tree/master/examples/sapper

https://github.com/babichjacob/sapper-postcss-template

https://github.com/sarioglu/sapper-tailwindcss-template

https://github.com/sveltejs/language-tools/blob/master/docs/preprocessors/other-css-preprocessors.md

중요: 분명히 이것은 시작점일 뿐입니다. 추가 단계는 TailwindCSS 문서를 검토하세요.

참고: TailwindCSS로 이미 구성된 Smelte와 Sapper 및 Svelte가 있는 멋진 Material 구성 요소를 사용할 수도 있습니다. -> https://smeltejs.com/