Merge branch 'main' into patch-7

.github/PULL_REQUEST_TEMPLATE.md

@@ -21,3 +21,6 @@
 
 <!-- If you are a member of the Astro Discord, please add your username in the description so we can welcome you there! -->
 <!-- https://astro.build/chat -->
+
+<!-- TAKING PART IN HACKTOBERFEST? LET US KNOW! -->
+<!-- See https://contribute.docs.astro.build/guides/hacktoberfest/ for more details. -->

CONTRIBUTING.md

@@ -44,6 +44,8 @@ Submitting an Issue is usually the first step to making a change. After an Issue
 
 Larger contributions to the docs are encouraged after participating in Issues and Discussions, as unsolicited material may not fit into our existing plans.
 
+**Participating in Hacktoberfest?** See how you can get recognized for your translation PRs and PR reviews in our [Hacktoberfest guide](https://contribute.docs.astro.build/guides/hacktoberfest/).
+
 ### Examples of Helpful GitHub New Issues
 
 - a particular explanation is confusing (with explanation)

src/components/DeployGuidesNav.astro

@@ -29,6 +29,7 @@ const services: Service[] = [
  { title: 'AWS', slug: 'aws', supports: ['static'] },
  { title: 'AWS via Flightcontrol', slug: 'flightcontrol', supports: ['ssr', 'static'] },
  { title: 'AWS via SST', slug: 'sst', supports: ['ssr', 'static'] },
+ { title: 'Clever Cloud', slug: 'clever-cloud', supports: ['ssr', 'static'] },
  { title: 'Azion', slug: 'azion', supports: ['ssr', 'static'] },
  { title: 'Google Cloud', slug: 'google-cloud', supports: ['ssr', 'static'] },
  { title: 'Firebase Hosting', slug: 'google-firebase', supports: ['ssr', 'static'] },

src/components/tutorial/FeedbackButton.astro

@@ -429,6 +429,7 @@ const instanceId = Math.round(Math.random() * 10e9).toString(36);
  flex: 1;
  font: inherit;
  padding: 0.5rem;
+ border: 0;
  border-radius: 2rem;
  cursor: pointer;
  font-size: var(--sl-text-sm);

src/content/docs/de/guides/environment-variables.mdx

@@ -5,7 +5,7 @@ i18nReady: true
 ---
 import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
 
-Astro nutzt die in Vite eingebaute Unterstützung für Umgebungsvariablen und lässt dich [mit jeder seiner Methoden](https://vitejs.dev/guide/env-and-mode.html) mit ihnen arbeiten.
+Astro nutzt die in Vite eingebaute Unterstützung für Umgebungsvariablen und lässt dich [mit jeder seiner Methoden](https://vite.dev/guide/env-and-mode.html) mit ihnen arbeiten.
 
 Beachte, dass zwar _alle_ Umgebungsvariablen im serverseitigen Code verfügbar sind, aber aus Sicherheitsgründen nur Umgebungsvariablen mit dem Präfix `PUBLIC_` im clientseitigen Code verfügbar sind.
 
@@ -47,7 +47,7 @@ DB_PASSWORD="foobar"
 PUBLIC_POKEAPI="https://pokeapi.co/api/v2"
 ```
 
-Mehr über `.env`-Dateien findest du in der [Vite-Dokumentation](https://vitejs.dev/guide/env-and-mode.html#env-files).
+Mehr über `.env`-Dateien findest du in der [Vite-Dokumentation](https://vite.dev/guide/env-and-mode.html#env-files).
 
 ### Verwendung der Kommandozeilenschnittstelle (CLI)
 Du kannst auch Umgebungsvariablen hinzufügen, während du dein Projekt ausführst:

src/content/docs/de/guides/imports.mdx

@@ -273,7 +273,7 @@ const data = JSON.parse(json);
 
 ## Erweiterung der Unterstützung von Dateitypen
 
-Mit **Vite** und kompatiblen **Rollup**-Plugins kannst du Dateitypen importieren, die von Astro nicht nativ unterstützt werden. Wo du die benötigten Plugins findest erfährst du im Abschnitt [Finding Plugins](https://vitejs.dev/guide/using-plugins.html#finding-plugins) der Vite-Dokumentation.
+Mit **Vite** und kompatiblen **Rollup**-Plugins kannst du Dateitypen importieren, die von Astro nicht nativ unterstützt werden. Wo du die benötigten Plugins findest erfährst du im Abschnitt [Finding Plugins](https://vite.dev/guide/using-plugins.html#finding-plugins) der Vite-Dokumentation.
 
 
  :::note[plugin configuration]

src/content/docs/de/guides/markdown-content.mdx

@@ -501,7 +501,7 @@ Die von Astro standardmäßig verwendeten Plugins sind [GitHub-flavored Markdown
 Astro unterstützt von Haus aus [Shiki](https://shiki.matsu.io/) und [Prism](https://prismjs.com/) und ermöglicht so die Syntaxhervorhebung in folgenden Bereichen:
 
 - Mit Code-Zäunen (\`\`\`) umgebene Inhalte innerhalb von Markdown-Dateien (`.md`) und der [eingebauten `<Markdown />`-Komponente](#markdown-komponente).
-- Inhalte innerhalb der [eingebauten `<Code />`-Komponente](/de/reference/api-reference/#code-) (basierend auf Shiki) oder der [`<Prism />`-Komponente](/de/reference/api-reference/#prism-) (basierend auf Prism).
+- Inhalte innerhalb der [eingebauten `<Code />`-Komponente](/de/reference/components-reference/#code-) (basierend auf Shiki) oder der [`<Prism />`-Komponente](/de/reference/components-reference/#prism-) (basierend auf Prism).
 
 Shiki ist standardmäßig aktiviert und mit dem Design `github-dark` vorkonfiguriert. Die kompilierte Ausgabe wird auf Inline-Stile ohne überflüssige CSS-Klassen, Stylesheets oder clientseitigen JavaScript-Code beschränkt.
 

src/content/docs/de/guides/rss.mdx

@@ -117,7 +117,7 @@ export const collections = { blog };
 
 <Since v="2.1.0" pkg="@astrojs/rss" />
 
-Um einen RSS-Feed aus Dokumenten in `src/pages/` zu erstellen, verwende die Hilfsfunktion `pagesGlobToRssItems()`. Diese akzeptiert ein [`import.meta.glob`](https://vitejs.dev/guide/features.html#glob-import)-Ergebnis und gibt eine Liste gültiger RSS-Feed-Elemente aus (siehe [mehr über das Schreiben von Glob-Patterns](/de/guides/imports/#glob-patterns) um eingeschlossene Seiten anzugeben).
+Um einen RSS-Feed aus Dokumenten in `src/pages/` zu erstellen, verwende die Hilfsfunktion `pagesGlobToRssItems()`. Diese akzeptiert ein [`import.meta.glob`](https://vite.dev/guide/features.html#glob-import)-Ergebnis und gibt eine Liste gültiger RSS-Feed-Elemente aus (siehe [mehr über das Schreiben von Glob-Patterns](/de/guides/imports/#glob-patterns) um eingeschlossene Seiten anzugeben).
 
 :::caution
 Diese Funktion setzt voraus, überprüft jedoch nicht, dass alle erforderlichen Feed-Eigenschaften in der Frontmatter jedes Dokuments vorhanden sind. Wenn du auf Fehler stößt, überprüfe die Frontmatter jeder Seite manuell.

src/content/docs/de/guides/styling.mdx

@@ -209,7 +209,7 @@ import 'paket-name/styles.css';
 
 Wenn dein Paket **_keine_ Dateierweiterung vorschlägt** (z.B. `paket-name/styles`), musst du zuerst deine Astro-Konfiguration aktualisieren!
 
-Angenommen, du importierst eine CSS-Datei mit dem Namen `normalize` (ohne die Dateierweiterung) aus `paket-name`. Um sicherzustellen, dass wir deine Seite korrekt darstellen können, füge `paket-name` zum [Array `vite.ssr.noExternal`](https://vitejs.dev/config/ssr-options.html#ssr-noexternal) hinzu:
+Angenommen, du importierst eine CSS-Datei mit dem Namen `normalize` (ohne die Dateierweiterung) aus `paket-name`. Um sicherzustellen, dass wir deine Seite korrekt darstellen können, füge `paket-name` zum [Array `vite.ssr.noExternal`](https://vite.dev/config/ssr-options.html#ssr-noexternal) hinzu:
 
 ```js ins={7}
 // astro.config.mjs
@@ -225,7 +225,7 @@ export default defineConfig({
 ```
 
 :::note
-Dies ist eine [Vite-spezifische Einstellung](https://vitejs.dev/config/ssr-options.html#ssr-noexternal), die sich _nicht_ auf [Astro SSR](/de/guides/server-side-rendering/) bezieht (oder diese benötigt).
+Dies ist eine [Vite-spezifische Einstellung](https://vite.dev/config/ssr-options.html#ssr-noexternal), die sich _nicht_ auf [Astro SSR](/de/guides/server-side-rendering/) bezieht (oder diese benötigt).
 :::
 
 Jetzt kannst du `paket-name/normalize` importieren. Dieses wird von Astro wie jedes andere lokale Stylesheet gebündelt und optimiert.
@@ -488,7 +488,7 @@ Du kannst alle oben genannten CSS-Präprozessoren auch in JS-Frameworks verwende
 
 ## PostCSS
 
-Astro wird mit PostCSS als Teil von [Vite](https://vitejs.dev/guide/features.html#postcss) ausgeliefert. Um PostCSS für dein Projekt zu konfigurieren, erstelle eine Datei `postcss.config.cjs` im Stammverzeichnis des Projekts. Du kannst Plugins mit `require()` importieren, nachdem du sie installiert hast (zum Beispiel `npm install autoprefixer`).
+Astro wird mit PostCSS als Teil von [Vite](https://vite.dev/guide/features.html#postcss) ausgeliefert. Um PostCSS für dein Projekt zu konfigurieren, erstelle eine Datei `postcss.config.cjs` im Stammverzeichnis des Projekts. Du kannst Plugins mit `require()` importieren, nachdem du sie installiert hast (zum Beispiel `npm install autoprefixer`).
 
 ```js title="postcss.config.cjs" ins={3-4}
 module.exports = {
@@ -587,7 +587,7 @@ import rawStylesCSS from '../styles/main.css?raw';
 <style is:inline set:html={rawStylesCSS}></style>
 ```
 
-Siehe [Vite's docs](https://vitejs.dev/guide/assets.html#importing-asset-as-string) für alle Details.
+Siehe [Vite's docs](https://vite.dev/guide/assets.html#importing-asset-as-string) für alle Details.
 
 ### `?url` CSS-Importe
 
@@ -596,7 +596,7 @@ Für fortgeschrittene Anwendungsfälle kannst du eine direkte URL-Referenz für
 Dies wird für die meisten Benutzer nicht empfohlen. Platziere deine CSS-Dateien stattdessen innerhalb von `public/`, um eine einheitliche URL-Referenz zu erhalten.
 
 :::caution
-Wenn du eine kleinere CSS-Datei mit `?url` importierst, kann es sein, dass der base64-kodierte Inhalt der CSS-Datei als Daten-URL in deinem endgültigen Build zurückgegeben wird. Entweder schreibst du deinen Code so, dass er kodierte Daten-URLs unterstützt (`data:text/css;base64,...`) oder du setzt die Konfigurationsoption [`vite.build.assetsInlineLimit`](https://vitejs.dev/config/#build-assetsinlinelimit) auf `0`, um diese Funktion zu deaktivieren.
+Wenn du eine kleinere CSS-Datei mit `?url` importierst, kann es sein, dass der base64-kodierte Inhalt der CSS-Datei als Daten-URL in deinem endgültigen Build zurückgegeben wird. Entweder schreibst du deinen Code so, dass er kodierte Daten-URLs unterstützt (`data:text/css;base64,...`) oder du setzt die Konfigurationsoption [`vite.build.assetsInlineLimit`](https://vite.dev/config/#build-assetsinlinelimit) auf `0`, um diese Funktion zu deaktivieren.
 :::
 
 ```astro title="src/components/RawStylesUrl.astro" "?url"
@@ -608,13 +608,13 @@ import stylesUrl from '../styles/main.css?url';
 <link rel="stylesheet" href={stylesUrl}>
 ```
 
-Siehe [Vite's docs](https://vitejs.dev/guide/assets.html#importing-asset-as-url) für alle Details.
+Siehe [Vite's docs](https://vite.dev/guide/assets.html#importing-asset-as-url) für alle Details.
 
 [less]: https://lesscss.org/
 [sass]: https://sass-lang.com/
 [stylus]: https://stylus-lang.com/
 [svelte-style]: https://svelte.dev/docs#component-format-style
 [tailwind]: /de/guides/integrations-guide/tailwind/
-[vite-preprocessors]: https://vitejs.dev/guide/features.html#css-pre-processors
+[vite-preprocessors]: https://vite.dev/guide/features.html#css-pre-processors
 [vue-css-modules]: https://vue-loader.vuejs.org/guide/css-modules.html
 [vue-scoped]: https://vue-loader.vuejs.org/guide/scoped-css.html

src/content/docs/de/guides/troubleshooting.mdx

@@ -105,7 +105,7 @@ Verwende zum Beispiel `../components/**/*.js` in `src/pages/index.astro`, um die
 
  `astro.glob()` unterstützt keine dynamischen Variablen und keine Zeichenketten-Interpolation.
 
-Dies ist kein Fehler in Astro. Das liegt an einer Einschränkung der [Vite-Funktion `import.meta.glob()`](https://vitejs.dev/guide/features.html#glob-import), die nur statische Zeichenketten-Literale unterstützt.
+Dies ist kein Fehler in Astro. Das liegt an einer Einschränkung der [Vite-Funktion `import.meta.glob()`](https://vite.dev/guide/features.html#glob-import), die nur statische Zeichenketten-Literale unterstützt.
 
 Eine gängige Lösung ist es, stattdessen eine größere Gruppe von Dateien zu importieren, die alle benötigten Dateien enthält, und diese dann mit `Astro.glob()` zu filtern:
 
@@ -173,7 +173,7 @@ Dies kann nützlich sein, um Unterschiede zwischen der SSR-Ausgabe und den hydra
 
 ### Astro `<Debug />` Komponente
 
-Um dir das Debuggen deiner Astro-Komponenten zu erleichtern, bietet Astro eine eingebaute [`<Debug />`](/de/reference/api-reference/#debug-) Komponente, die jeden Wert direkt in die HTML-Vorlage deiner Komponente überträgt. Das ist nützlich für das schnelle Debugging im Browser, ohne dass du zwischen deinem Terminal und deinem Browser hin- und herwechseln musst.
+Um dir das Debuggen deiner Astro-Komponenten zu erleichtern, bietet Astro eine eingebaute [`<Debug />`](/de/reference/components-reference/#debug-) Komponente, die jeden Wert direkt in die HTML-Vorlage deiner Komponente überträgt. Das ist nützlich für das schnelle Debugging im Browser, ohne dass du zwischen deinem Terminal und deinem Browser hin- und herwechseln musst.
 
 ```astro {2,7}
 ---

src/content/docs/de/guides/typescript.mdx

@@ -29,7 +29,7 @@ Um von einer der Vorlagen zu erben, verwende [die Einstellung `extends`] (https:
 }
 ```
 
-Außerdem enthalten unsere Vorlagen eine Datei `env.d.ts` im Ordner `src`, um die [Client-Typen](https://vitejs.dev/guide/features.html#client-types) von Vite für dein Projekt bereitzustellen:
+Außerdem enthalten unsere Vorlagen eine Datei `env.d.ts` im Ordner `src`, um die [Client-Typen](https://vite.dev/guide/features.html#client-types) von Vite für dein Projekt bereitzustellen:
 
 ```typescript title="env.d.ts"
 /// <reference types="astro/client" />

src/content/docs/de/guides/upgrade-to/v2.mdx

@@ -387,13 +387,13 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
 
 ### Aktualisiert: Vite 4
 
-Astro v2.0 führt ein Upgrade von Vite 3 auf [Vite 4](https://vitejs.dev/) durch, das im Dezember 2022 veröffentlicht wird.
+Astro v2.0 führt ein Upgrade von Vite 3 auf [Vite 4](https://vite.dev/) durch, das im Dezember 2022 veröffentlicht wird.
 
 #### Was soll ich tun?
 
 Es sollten keine Änderungen an deinem Code nötig sein! Wir haben den Großteil des Upgrades innerhalb von Astro für dich erledigt, aber einige Verhaltensweisen von Vite können sich zwischen den Versionen noch ändern.
 
-Schau im offiziellen [Vite Migration Guide](https://vitejs.dev/guide/migration.html) nach, wenn du auf Probleme stößt.
+Schau im offiziellen [Vite Migration Guide](https://vite.dev/guide/migration.html) nach, wenn du auf Probleme stößt.
 
 ## Astro v2.0 Experimentelle Optionen wurden entfernt
 

src/content/docs/de/reference/api-reference.mdx

@@ -34,7 +34,7 @@ themes---
 
 `glob()` benötigt nur einen Parameter: einen relativen URL-Glob der lokalen Dateien, die du importieren möchtest. Die Funktion arbeitet asynchron und gibt ein Array mit den Exporten der passenden Dateien zurück.
 
-`.glob()` kann keine Variablen oder Strings annehmen, die sie interpolieren, da sie nicht statisch analysierbar sind. (Siehe [die Anleitung zur Fehlerbehebung](/de/guides/troubleshooting/#unterstützte-werte) für einen Workaround) Das liegt daran, dass `Astro.glob()` ein Wrapper von Vite's [`import.meta.glob()`](https://vitejs.dev/guide/features.html#glob-import) ist.
+`.glob()` kann keine Variablen oder Strings annehmen, die sie interpolieren, da sie nicht statisch analysierbar sind. (Siehe [die Anleitung zur Fehlerbehebung](/de/guides/troubleshooting/#unterstützte-werte) für einen Workaround) Das liegt daran, dass `Astro.glob()` ein Wrapper von Vite's [`import.meta.glob()`](https://vite.dev/guide/features.html#glob-import) ist.
 
 :::note
 Du kannst auch `import.meta.glob()` selbst in deinem Astro-Projekt verwenden. Du solltest dies tun, wenn:
@@ -43,7 +43,7 @@ Du kannst auch `import.meta.glob()` selbst in deinem Astro-Projekt verwenden. Du
 - Du willst Zugriff auf den Pfad jeder Datei. Die Funktion `import.meta.glob()` gibt eine Abbildung des Dateipfads auf den Inhalt zurück, während `Astro.glob()` eine Liste des Inhalts zurückgibt.
 - Du möchtest mehrere Pattern übergeben; zum Beispiel möchtest du ein "negatives Muster" hinzufügen, das bestimmte Dateien herausfiltert. die Funktion `import.meta.glob()` kann optional ein Array von glob-Zeichenfolgen entgegennehmen, anstatt einer einzelnen Zeichenfolge.
 
-Mehr dazu findest du in der [Vite-Dokumentation] (https://vitejs.dev/guide/features.html#glob-import).
+Mehr dazu findest du in der [Vite-Dokumentation] (https://vite.dev/guide/features.html#glob-import).
 :::
 #### Markdown-Dateien
 
@@ -852,7 +852,7 @@ const { Content, headings, remarkPluginFrontmatter } = await entry.render();
 
 ## `import.meta`
 
-Alle ESM-Module enthalten die Eigenschaft `import.meta`. Astro fügt die Eigenschaft "import.meta.env" über [Vite](https://vitejs.dev/guide/env-and-mode.html) hinzu.
+Alle ESM-Module enthalten die Eigenschaft `import.meta`. Astro fügt die Eigenschaft "import.meta.env" über [Vite](https://vite.dev/guide/env-and-mode.html) hinzu.
 
 **`import.meta.env.SSR`** kann verwendet werden, um zu wissen, wann auf dem Server gerendert wird. Manchmal willst du vielleicht eine andere Logik, zum Beispiel eine Komponente, die nur auf dem Client gerendert werden soll: