Flowbite Svelte #2 - 시작

새로운 프로젝트를 시작합니다

---

https://svelte.dev/docs/introduction

Introduction • Docs • Svelte

 

Svelte 공식홈페이지의 document는 이렇게 시작한다.

"새로운 Svelte 프로젝트를 시작한다면 우리는 SvelteKit을 사용할 것을 권장합니다."

 

SvelteKit은 Svelte Team이 제공하는 공식 프레임워크 입니다.

SvelteKit을 사용하기 전에 앞서 올려드린 npm을 설치해야 합니다.

https://npackgames.tistory.com/45

npm vs. pnpm

 

새로운 프로젝트를 아래와 같이 시작합니다.

npm create svelte@latest myapp
cd myapp
npm install
npm run dev

SvelteKit은 Svelte compiler를 호출하여 .svelte 파일을 .js와 .css 파일로 변환합니다. 또한 개발서버, 라우팅, 배포 그리고 SSR 지원등 웹 어플리케이션을 구축하기 위한 다른 모든 부분도 제공합니다. SvelteKit은 Vite를 사용합니다.

 

실제 프로젝트 생성 스크린샷 입니다.

SvelteKit demo app을 선택하면 다음과 같은 화면의 데모 앱을 볼 수 있습니다.

데모 앱 화면

 

코딩 언어를 선택합니다.

 

기타 등등 옵션들

다 만들면 다음에 해야할 일들도 친절하게 알려준다.

SvelteKit의 대안

만약 어떤 이유로든 SvelteKit을 사용하기 싫다면 SvelteKit없이 Vite를 이용할 수 있습니다. 

npm create vite@latest

 

그리고 svelte 옵션을 선택합니다.

npm run build

 

위 명령어를 통해서 dist 디렉터리에 HTML, CSS, JS 파일이 생성되어 저장됩니다.