Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/nyxb/velocita
https://github.com/nyxb/velocita
Last synced: 12 days ago
JSON representation
- Host: GitHub
- URL: https://github.com/nyxb/velocita
- Owner: nyxb
- License: mit
- Created: 2023-11-28T22:28:42.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2023-11-29T16:17:13.000Z (about 1 year ago)
- Last Synced: 2024-11-21T04:44:06.847Z (2 months ago)
- Language: TypeScript
- Size: 422 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.de-DE.md
- Funding: .github/FUNDING.yml
- License: LICENSE
Awesome Lists containing this project
README
Erstelle Webanwendungen schnell mit Velocita
> **Hinweis**: Diese Vorlage wurde in den frühen Phasen von Vue 3 und Vite erstellt. Wenn du nach einer besseren Vue-Entwicklungserfahrung und kontinuierlicher Wartung suchst, empfehlen wir dir, [Nuxt 3](https://nuxt.com) zu verwenden (das kannst du auch als SPA oder SSG nutzen, je nach Bedarf). Diese Vorlage wird weiterhin als Referenz langsam gepflegt, aber es wird nicht viele Updates geben.
Englisch | German
## Features
- ⚡️ [Vue 3](https://github.com/vuejs/core), [Vite](https://github.com/vitejs/vite), [pnpm](https://pnpm.io/), [esbuild](https://github.com/evanw/esbuild) - es ist superschnell!
- 🗂 [Dateibasiertes Routing](./src/pages)
- 📦 [Automatisches Laden von Komponenten](./src/components)
- 🍍 [Zustandsverwaltung mit Pinia](https://pinia.vuejs.org)
- 📑 [Layout-System](./src/layouts)
- 📲 [PWA](https://github.com/nyxb/vite-plugin-pwa)
- 🎨 [UnoCSS](https://github.com/unocss/unocss) - Ein Atomic-CSS-Engine, der sowohl leistungsstark als auch flexibel ist
- 😃 [Verschiedene Icon-Sets für dich](https://github.com/nyxb/unocss/tree/main/packages/preset-icons)
- 🌍 [I18n Internationalisierung sofort einsatzbereit](./locales)
- 🗒 [Markdown-Unterstützung](https://github.com/unplugin/unplugin-vue-markdown)
- 🔥 Nutze die [neue `` Syntax](https://github.com/vuejs/rfcs/pull/227)
- 📥 [API-Autoimport](https://github.com/unplugin/unplugin-auto-import) - Nutze die Composition API direkt ohne Import
- 🖨 Erzeuge serverseitig mit [vite-ssg](https://github.com/nyxb/vite-ssg)
- 🦔 Generiere kritische CSS mit [critters](https://github.com/GoogleChromeLabs/critters)
- 🦾 TypeScript, natürlich
- ⚙️ Nutze [GitHub Actions](https://github.com/features/actions) für Unit-Tests mit [Vitest](https://github.com/vitest-dev/vitest), E2E-Tests mit [Cypress](https://cypress.io/)
- ☁️ Einfaches Deployment auf Netlify ohne Konfiguration
<br>
## Vorkonfiguration
### UI-Framework
- [UnoCSS](https://github.com/antfu/unocss) - Ein leistungsstarker und flexibler Atomic-CSS-Engine
### Icons
- [Iconify](https://iconify.design) - Nutze beliebige Icon-Sets, schau mal hier: [🔍Icônes](https://icones.netlify.app/)
- [UnoCSS's Pure CSS Icon-Lösungen](https://github.com/antfu/unocss/tree/main/packages/preset-icons)### Plugins
- [Vue Router](https://github.com/vuejs/router)
- [`unplugin-vue-router`](https://github.com/posva/unplugin-vue-router) - Routing basierend auf deinem Dateisystem
- [`vite-plugin-vue-layouts`](https://github.com/JohnCampionJr/vite-plugin-vue-layouts) - Layoutsystem für deine Seiten
- [Pinia](https://pinia.vuejs.org) - Eine direkte, typsichere und flexible Zustandsverwaltung
- [`unplugin-vue-components`](https://github.com/antfu/unplugin-vue-components) - Lade deine Komponenten automatisch
- [`unplugin-auto-import`](https://github.com/antfu/unplugin-auto-import) - Nutze APIs wie die Composition API direkt ohne Import
- [`vite-plugin-pwa`](https://github.com/antfu/vite-plugin-pwa) - PWA Support
- [`unplugin-vue-markdown`](https://github.com/antfu/unplugin-vue-markdown) - Markdown als Komponenten und umgekehrt
- [`markdown-it-prism`](https://github.com/jGleitz/markdown-it-prism) - Syntaxhervorhebung mit Prism
- [`prism-theme-vars`](https://github.com/antfu/prism-theme-vars) - Passe Prism.js-Themen mit CSS-Variablen an
- [Vue I18n](https://github.com/intlify/vue-i18n-next) - Internationalisierung
- [`unplugin-vue-i18n`](https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n) - Vue I18n Vite Plugin
- [VueUse](https://github.com/antfu/vueuse) - Sammlung von nützlichen Composition APIs
- [`vite-ssg-sitemap`](https://github.com/jbaubree/vite-ssg-sitemap) - Sitemap-Generator
- [`@vueuse/head`](https://github.com/vueuse/head) - Bearbeite den Dokumentenkopf reaktionsfähig
- [`vite-plugin-vue-devtools`](https://github.com/webfansplz/vite-plugin-vue-devtools) - Ein Vite-Plugin, das deine Vue-Entwicklungserfahrung verbessert### Codierungsstil
- Nutze die Composition API mit der [`<script setup>` SFC Syntax](https://github.com/vuejs/rfcs/pull/227)
- [ESLint](https://eslint.org/) konfiguriert nach [@nyxb/eslint-config](https://github.com/nyxb/eslint-config), Einzelzitate, ohne Semikolons.### Entwicklungswerkzeuge
- [TypeScript](https://www.typescriptlang.org/)
- [Vitest](https://github.com/vitest-dev/vitest) - Ein Unit-Test-Framework basierend auf Vite
- [Cypress](https://cypress.io/) - E2E-Tests
- [pnpm](https://pnpm.js.org/) - Ein schneller, platzsparender Paketmanager
- [`vite-ssg`](https://github.com/antfu/vite-ssg) - Serverseitige Generierung
- [critters](https://github.com/GoogleChromeLabs/critters) - Generator für kritischen CSS
- [Netlify](https://www.netlify.com/) - Deployment ohne jegliche Konfiguration
- [VS Code Erweiterungen](./.vscode/extensions.json)
- [Velocita](https://marketplace.visualstudio.com/items?itemName=nyxb.velocita) - Startet den Vite-Server automatisch
- [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) - IDE-Unterstützung für Vue 3 `<script setup>`
- [Iconify IntelliSense](https://marketplace.visualstudio.com/items?itemName=antfu.iconify) - Icons werden direkt angezeigt und vervollständigt
- [i18n Ally](https://marketplace.visualstudio.com/items?itemName=lokalise.i18n-ally) - Unterstützung für I18n in einem## Ablegerprojekte
Weil dieses Template für spezifische Anwendungsfälle gemacht ist, findest du hier eine Liste von Ablegern aus der Community mit verschiedenen Vorlieben und Funktionssätzen. Schau sie dir an. Und klar, du kannst auch gerne einen Pull Request mit deinem eigenen Projekt einreichen!
###### Offiziell
- [velocita-lite](https://github.com/nyxb/velocita-lite) - Die leichte Version von Velocita
- [velocita-nuxt3](https://github.com/nyxb/velocita-nuxt3) - Die Nuxt 3 Version von Velocita
- [velocita-nuxt-bridge](https://github.com/nyxb/velocita-nuxt-bridge) - Die Nuxt2 Bridge-Version von Velocita
- [velocita-webext](https://github.com/nyxb/velocita-webext) - Ein sofort einsatzbereites Templatefür Browser-Erweiterungen mit Vite
###### Community
[Schau dir die englische Version an](./README.md#community)
## Probier's aus!
> Velocita benötigt Node.js Version >=14.18
### GitHub Template
[Erstelle ein Repository mit diesem Template](https://github.com/nyxb/velocita/generate).
### Lokal klonen
Wenn du es vorziehst, das manuell mit einer sauberen Git-Historie zu tun:
```bash
npx degit nyxb/velocita my-velocita-app
cd my-velocita-app
pnpm i # Wenn du pnpm noch nicht hast, installiere es zuerst: npm install -g pnpm
```## Checkliste
Wenn du dieses Template nutzt, aktualisiere deine eigenen Informationen nach dieser Checkliste:
- [ ] Ändere den Autorennamen in `LICENSE`
- [ ] Ändere den Titel in `App.vue`
- [ ] Ändere den Hostnamen in `vite.config.ts`
- [ ] Ändere das Favicon im `public`-Verzeichnis
- [ ] Entferne die Infos über Sponsoren im `.github`-Ordner
- [ ] Überarbeite die README und lösche die AnleitungenDanach, genieße es :)
## Nutzung
### Entwickeln
Mit dem folgenden Befehl kannst du die Anwendung unter http://localhost:3333 sehen:
```bash
pnpm dev
```### Bauen
Um die Anwendung zu bauen, führe einfach den folgenden Befehl aus:
```bash
pnpm build
```Danach siehst du den für die Veröffentlichung vorgesehenen `dist`-Ordner.
### Deployment auf Netlify
Geh zu [Netlify](https://app.netlify.com/start) und wähle dein Repository aus, klicke dich durch mit `OK`, und nach einer kurzen Wartezeit wird deine Anwendung erstellt.