Simon Malm
788d500821
Some checks failed
CI / test (22) (push) Failing after 39s
CI / test (20) (push) Failing after 2m56s
CI / build (push) Has been skipped
CI / security (push) Failing after 2m30s
Deploy / docker-build (push) Failing after 9s
Deploy / build-and-deploy (push) Failing after 41s
Gitea CI / test (push) Failing after 33s
Gitea CI / docker-build (push) Has been skipped
134 lines
3.2 KiB
Markdown
134 lines
3.2 KiB
Markdown
# Svelte 5 Static Template with shadcn-svelte
|
|
|
|
A modern, production-ready template for building static websites with Svelte 5, SvelteKit, and shadcn-svelte components, containerized with nginx.
|
|
|
|
## Features
|
|
|
|
- ⚡ **Svelte 5** - Latest version with new features
|
|
- 🏗️ **SvelteKit** - Full-stack framework with static adapter
|
|
- 🎨 **shadcn-svelte** - Beautiful, accessible UI components
|
|
- 🎭 **Tailwind CSS 4** - Latest version for styling
|
|
- 📝 **TypeScript** - Type safety out of the box
|
|
- 🧪 **Testing Suite** - Vitest for unit tests, Playwright for E2E
|
|
- 📏 **Code Quality** - ESLint + Prettier configured
|
|
- 🐳 **Docker Ready** - Production nginx container
|
|
- 🚀 **Static Generation** - Optimized for deployment anywhere
|
|
|
|
## Quick Start
|
|
|
|
### Development
|
|
|
|
```bash
|
|
# Install dependencies
|
|
bun install
|
|
|
|
# Start development server
|
|
bun run dev
|
|
```
|
|
|
|
### Production Build
|
|
|
|
```bash
|
|
# Build static site
|
|
bun run build
|
|
|
|
# Preview production build
|
|
bun run preview
|
|
```
|
|
|
|
### Docker Deployment
|
|
|
|
```bash
|
|
# Build and run with Docker Compose
|
|
docker-compose up --build
|
|
|
|
# Or build Docker image manually
|
|
docker build -t svelte-static-app .
|
|
docker run -p 3000:80 svelte-static-app
|
|
```
|
|
|
|
## Project Structure
|
|
|
|
```
|
|
├── src/
|
|
│ ├── lib/
|
|
│ │ ├── components/ui/ # shadcn-svelte components
|
|
│ │ └── utils.ts # Utility functions
|
|
│ ├── routes/ # SvelteKit routes
|
|
│ └── app.html # HTML template
|
|
├── static/ # Static assets
|
|
├── tests/ # Test files
|
|
├── Dockerfile # Multi-stage Docker build
|
|
├── nginx.conf # Nginx configuration
|
|
└── docker-compose.yml # Container orchestration
|
|
```
|
|
|
|
## Scripts
|
|
|
|
- `bun run dev` - Start development server
|
|
- `bun run build` - Build for production
|
|
- `bun run preview` - Preview production build
|
|
- `bun run test` - Run all tests
|
|
- `bun run test:unit` - Run unit tests
|
|
- `bun run test:e2e` - Run E2E tests
|
|
- `bun run lint` - Lint code
|
|
- `bun run format` - Format code
|
|
|
|
## Adding UI Components
|
|
|
|
Use the shadcn-svelte CLI to add components:
|
|
|
|
```bash
|
|
# Add a component
|
|
bunx shadcn-svelte@latest add [component-name]
|
|
|
|
# Example: Add a dialog component
|
|
bunx shadcn-svelte@latest add dialog
|
|
```
|
|
|
|
## Configuration
|
|
|
|
### Static Adapter
|
|
|
|
The static adapter is configured in `svelte.config.js`. Modify settings as needed:
|
|
|
|
```js
|
|
adapter: adapter({
|
|
pages: 'build', // Output directory
|
|
assets: 'build', // Assets directory
|
|
fallback: undefined, // SPA fallback page
|
|
precompress: false, // Enable gzip/brotli
|
|
strict: true // Strict prerendering
|
|
});
|
|
```
|
|
|
|
### Nginx
|
|
|
|
Production nginx configuration in `nginx.conf` includes:
|
|
|
|
- Gzip compression
|
|
- Static asset caching
|
|
- Security headers
|
|
- SPA routing support
|
|
|
|
## Deployment
|
|
|
|
This template generates a static site that can be deployed to:
|
|
|
|
- **Static Hosts**: Netlify, Vercel, GitHub Pages
|
|
- **Docker**: Any container platform (production nginx setup)
|
|
- **CDN**: Any CDN with the built files
|
|
- **Traditional Hosting**: Any web server
|
|
|
|
## Contributing
|
|
|
|
1. Fork the repository
|
|
2. Create a feature branch
|
|
3. Make your changes
|
|
4. Run tests and linting
|
|
5. Submit a pull request
|
|
|
|
## License
|
|
|
|
MIT License - see LICENSE file for details
|