diff --git a/.github/PULL_REQUEST_TEMPLATE.md b/.github/PULL_REQUEST_TEMPLATE.md
index ce608be0d4299..07081720f0393 100644
--- a/.github/PULL_REQUEST_TEMPLATE.md
+++ b/.github/PULL_REQUEST_TEMPLATE.md
@@ -21,3 +21,6 @@
+
+
+
diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 3ed175d4a8b57..ab2de810d0102 100644
--- a/CONTRIBUTING.md
+++ b/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)
diff --git a/public/logos/clever-cloud.svg b/public/logos/clever-cloud.svg
new file mode 100644
index 0000000000000..e80b3f860a25c
--- /dev/null
+++ b/public/logos/clever-cloud.svg
@@ -0,0 +1,12 @@
+
\ No newline at end of file
diff --git a/src/components/DeployGuidesNav.astro b/src/components/DeployGuidesNav.astro
index ae2bb8a9e423b..a1140dc22570f 100644
--- a/src/components/DeployGuidesNav.astro
+++ b/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'] },
diff --git a/src/components/tutorial/FeedbackButton.astro b/src/components/tutorial/FeedbackButton.astro
index c544376b75c8c..ddfd6821a6e34 100644
--- a/src/components/tutorial/FeedbackButton.astro
+++ b/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);
diff --git a/src/content/docs/de/guides/environment-variables.mdx b/src/content/docs/de/guides/environment-variables.mdx
index f5ffdabf72bb8..cfe0d1349ca10 100644
--- a/src/content/docs/de/guides/environment-variables.mdx
+++ b/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:
diff --git a/src/content/docs/de/guides/imports.mdx b/src/content/docs/de/guides/imports.mdx
index db53fcbfab67d..708d407239b21 100644
--- a/src/content/docs/de/guides/imports.mdx
+++ b/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]
diff --git a/src/content/docs/de/guides/markdown-content.mdx b/src/content/docs/de/guides/markdown-content.mdx
index f9ab092cc5e53..ec673a33384f6 100644
--- a/src/content/docs/de/guides/markdown-content.mdx
+++ b/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 ``-Komponente](#markdown-komponente).
-- Inhalte innerhalb der [eingebauten ``-Komponente](/de/reference/api-reference/#code-) (basierend auf Shiki) oder der [``-Komponente](/de/reference/api-reference/#prism-) (basierend auf Prism).
+- Inhalte innerhalb der [eingebauten ``-Komponente](/de/reference/components-reference/#code-) (basierend auf Shiki) oder der [``-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.
diff --git a/src/content/docs/de/guides/rss.mdx b/src/content/docs/de/guides/rss.mdx
index 85b8c509703a7..603fb86f11d2c 100644
--- a/src/content/docs/de/guides/rss.mdx
+++ b/src/content/docs/de/guides/rss.mdx
@@ -117,7 +117,7 @@ export const collections = { blog };
-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.
diff --git a/src/content/docs/de/guides/styling.mdx b/src/content/docs/de/guides/styling.mdx
index 5372294b8b28a..46fa2f3549d40 100644
--- a/src/content/docs/de/guides/styling.mdx
+++ b/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';
```
-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';
```
-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
diff --git a/src/content/docs/de/guides/troubleshooting.mdx b/src/content/docs/de/guides/troubleshooting.mdx
index 8e29491296f82..2912d668ec9e6 100644
--- a/src/content/docs/de/guides/troubleshooting.mdx
+++ b/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 `` Komponente
-Um dir das Debuggen deiner Astro-Komponenten zu erleichtern, bietet Astro eine eingebaute [``](/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 [``](/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}
---
diff --git a/src/content/docs/de/guides/typescript.mdx b/src/content/docs/de/guides/typescript.mdx
index 0ac1df18f1076..e34feb54ea600 100644
--- a/src/content/docs/de/guides/typescript.mdx
+++ b/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"
///
diff --git a/src/content/docs/de/guides/upgrade-to/v2.mdx b/src/content/docs/de/guides/upgrade-to/v2.mdx
index 75df16c504fef..bd3b2841fc2c9 100644
--- a/src/content/docs/de/guides/upgrade-to/v2.mdx
+++ b/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
diff --git a/src/content/docs/de/reference/api-reference.mdx b/src/content/docs/de/reference/api-reference.mdx
index 8948da6a00ec7..f4cec33091023 100644
--- a/src/content/docs/de/reference/api-reference.mdx
+++ b/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:
diff --git a/src/content/docs/de/reference/integrations-reference.mdx b/src/content/docs/de/reference/integrations-reference.mdx
index 33c791f908108..25ea32ebc340e 100644
--- a/src/content/docs/de/reference/integrations-reference.mdx
+++ b/src/content/docs/de/reference/integrations-reference.mdx
@@ -54,9 +54,9 @@ interface AstroIntegration {
**Nächster Hook:** [`astro:config:done`](#astroconfigdone)
-**Wann:** Bei der Initialisierung, bevor entweder die [Vite](https://vitejs.dev/config/) oder die [Astro config](/de/reference/configuration-reference/) verarbeitet wurden.
+**Wann:** Bei der Initialisierung, bevor entweder die [Vite](https://vite.dev/config/) oder die [Astro config](/de/reference/configuration-reference/) verarbeitet wurden.
-**Warum:** Um die Projektkonfiguration zu erweitern. Dazu gehört das Aktualisieren der [Astro config](/de/reference/configuration-reference/), das Anwenden von [Vite plugins](https://vitejs.dev/guide/api-plugin.html), das Hinzufügen von Komponenten-Renderern und das Einfügen von Skripten in die Seite.
+**Warum:** Um die Projektkonfiguration zu erweitern. Dazu gehört das Aktualisieren der [Astro config](/de/reference/configuration-reference/), das Anwenden von [Vite plugins](https://vite.dev/guide/api-plugin.html), das Hinzufügen von Komponenten-Renderern und das Einfügen von Skripten in die Seite.
```ts
'astro:config:setup'?: (options: {
@@ -96,7 +96,7 @@ Eine schreibgeschützte Kopie der vom Benutzer bereitgestellten [Astro-Konfigura
Eine Callback-Funktion zum Aktualisieren der vom Benutzer bereitgestellten [Astro-Konfiguration](/de/reference/configuration-reference/). Jede Konfiguration, die du bereitstellst, **wird mit der Benutzerkonfiguration und anderen Aktualisierungen der Integrationskonfiguration zusammengeführt,** du kannst also auch Schlüssel weglassen!
-Angenommen, du musst ein [Vite](https://vitejs.dev/)-Plugin für das Projekt des Benutzers bereitstellen:
+Angenommen, du musst ein [Vite](https://vite.dev/)-Plugin für das Projekt des Benutzers bereitstellen:
```js
import bananaCSS from '@vitejs/official-banana-css-plugin';
@@ -165,7 +165,7 @@ injectRoute({
Eine Callback-Funktion, die einen String mit JavaScript-Inhalt auf jeder Seite einfügt.
-Die **`stage`** gibt an, wie dieses Skript (der `content`) eingefügt werden soll. Einige Stufen erlauben das Einfügen von Skripten ohne Änderungen, während andere eine Optimierung während des [Vite-Bündelungsschritts](https://vitejs.dev/guide/build.html) ermöglichen:
+Die **`stage`** gibt an, wie dieses Skript (der `content`) eingefügt werden soll. Einige Stufen erlauben das Einfügen von Skripten ohne Änderungen, während andere eine Optimierung während des [Vite-Bündelungsschritts](https://vite.dev/guide/build.html) ermöglichen:
- `"head-inline"`: Eingefügt in ein Skript-Tag im `` jeder Seite. **Nicht** von Vite optimiert oder aufgelöst.
- `before-hydration`: Wird clientseitig importiert, bevor das Hydrations-Skript läuft. Optimiert und aufgelöst von Vite.
@@ -203,7 +203,7 @@ Eine schreibgeschützte Kopie der vom Benutzer bereitgestellten [Astro-Konfigura
**Nächster Hook:** [`astro:server:start`](#astroserverstart)
-**Wann:** Kurz nachdem der Vite-Server im "dev"-Modus erstellt wurde, aber bevor das Ereignis `listen()` ausgelöst wird. [Siehe Vites createServer API](https://vitejs.dev/guide/api-javascript.html#createserver) für weitere Informationen.
+**Wann:** Kurz nachdem der Vite-Server im "dev"-Modus erstellt wurde, aber bevor das Ereignis `listen()` ausgelöst wird. [Siehe Vites createServer API](https://vite.dev/guide/api-javascript.html#createserver) für weitere Informationen.
**Warum:** Um die Vite-Serveroptionen und die Middleware zu aktualisieren.
@@ -213,7 +213,7 @@ Eine schreibgeschützte Kopie der vom Benutzer bereitgestellten [Astro-Konfigura
#### `server`-Option
-**Typ:** [`ViteDevServer`](https://vitejs.dev/guide/api-javascript.html#vitedevserver)
+**Typ:** [`ViteDevServer`](https://vite.dev/guide/api-javascript.html#vitedevserver)
Eine veränderbare Instanz des Vite-Servers, die im "dev"-Modus verwendet wird. Dies wird zum Beispiel [von unserer Partytown-Integration](/de/guides/integrations-guide/partytown/) verwendet, um den Partytown-Server als Middleware zu injizieren:
@@ -327,7 +327,7 @@ Die Adresse, Familie und Portnummer, die vom [NodeJS-Net-Modul](https://nodejs.o
**Wann:** Nachdem ein Produktions-Build (SSG oder SSR) abgeschlossen wurde.
-**Warum:** Um auf generierte Routen und Assets für die Erweiterung zuzugreifen (z.B. um Inhalte in das generierte `/assets` Verzeichnis zu kopieren). Wenn du vorhast, die generierten Assets umzuwandeln, empfehlen wir, stattdessen die [Vite Plugin-API](https://vitejs.dev/guide/api-plugin.html) und die [Konfiguration über `astro:config:setup`](#updateconfig-option) zu nutzen.
+**Warum:** Um auf generierte Routen und Assets für die Erweiterung zuzugreifen (z.B. um Inhalte in das generierte `/assets` Verzeichnis zu kopieren). Wenn du vorhast, die generierten Assets umzuwandeln, empfehlen wir, stattdessen die [Vite Plugin-API](https://vite.dev/guide/api-plugin.html) und die [Konfiguration über `astro:config:setup`](#updateconfig-option) zu nutzen.
```js
'astro:build:done'?: (options: { dir: URL; routes: RouteData[] }) => void | Promise;
diff --git a/src/content/docs/en/basics/astro-components.mdx b/src/content/docs/en/basics/astro-components.mdx
index eea643c1769bc..11ccd4550f84e 100644
--- a/src/content/docs/en/basics/astro-components.mdx
+++ b/src/content/docs/en/basics/astro-components.mdx
@@ -252,7 +252,7 @@ import Wrapper from '../components/Wrapper.astro';
Use a `slot="my-slot"` attribute on the child element that you want to pass through to a matching `` placeholder in your component.
:::
-To pass multiple HTML elements into a component's `` placeholder without a wrapping `
`, use the `slot=""` attribute on [Astro's `` component](/en/reference/api-reference/#fragment-):
+To pass multiple HTML elements into a component's `` placeholder without a wrapping `
`, use the `slot=""` attribute on [Astro's `` component](/en/reference/components-reference/#fragment-):
```astro title="src/components/CustomTable.astro" "" ""
---
diff --git a/src/content/docs/en/basics/project-structure.mdx b/src/content/docs/en/basics/project-structure.mdx
index 20b932c4a748a..52377922447df 100644
--- a/src/content/docs/en/basics/project-structure.mdx
+++ b/src/content/docs/en/basics/project-structure.mdx
@@ -32,14 +32,20 @@ A common Astro project directory might look like this:
- components/
- Header.astro
- Button.jsx
+ - content/
+ - config.ts
+ - posts/
+ - post1.md
+ - post2.md
+ - post3.md
- layouts/
- PostLayout.astro
- pages/
- posts/
- - post1.md
- - post2.md
- - post3.md
- - index.astro
+ - [post].astro
+ - about.astro
+ - **index.astro**
+ - rss.xml.js
- styles/
- global.css
- astro.config.mjs
@@ -66,6 +72,14 @@ Some files (like Astro components) are not even sent to the browser as written b
While this guide describes some popular conventions used in the Astro community, the only directories reserved by Astro are `src/pages/` and `src/content/`. You are free to rename and reorganize any other directories in a way that works best for you.
:::
+### `src/pages`
+
+Pages routes are created for your site by adding [supported file types](/en/basics/astro-pages/#supported-page-files) to this directory.
+
+:::caution
+`src/pages` is a **required** sub-directory in your Astro project. Without it, your site will have no pages or routes!
+:::
+
### `src/components`
**Components** are reusable units of code for your HTML pages. These could be [Astro components](/en/basics/astro-components/), or [UI framework components](/en/guides/framework-components/) like React or Vue. It is common to group and organize all of your project components together in this folder.
@@ -74,7 +88,7 @@ This is a common convention in Astro projects, but it is not required. Feel free
### `src/content`
-The `src/content/` directory is reserved to store [content collections](/en/guides/content-collections/) and an optional collections configuration file. No other files are allowed inside this folder.
+The `src/content/` directory is reserved to store [content collections](/en/guides/content-collections/) and a configuration file. No other files are allowed inside this folder.
### `src/layouts`
@@ -82,14 +96,6 @@ The `src/content/` directory is reserved to store [content collections](/en/guid
Just like `src/components`, this directory is a common convention but not required.
-### `src/pages`
-
-[Pages](/en/basics/astro-pages/) are a special kind of component used to create new pages on your site. A page can be an Astro component, or a Markdown file that represents some page of content for your site.
-
-:::caution
-`src/pages` is a **required** sub-directory in your Astro project. Without it, your site will have no pages or routes!
-:::
-
### `src/styles`
It is a common convention to store your CSS or Sass files in a `src/styles` directory, but this is not required. As long as your styles live somewhere in the `src/` directory and are imported correctly, Astro will handle and optimize them.
diff --git a/src/content/docs/en/guides/actions.mdx b/src/content/docs/en/guides/actions.mdx
index bd18a2614186e..b91806302bf37 100644
--- a/src/content/docs/en/guides/actions.mdx
+++ b/src/content/docs/en/guides/actions.mdx
@@ -569,7 +569,7 @@ For example, you might return the name of a product in an `addToCart` action, ra
import { defineAction } from 'astro:actions';
export const server = {
- addToCard: defineAction({
+ addToCart: defineAction({
handler: async () => {
/* ... */
return product;
diff --git a/src/content/docs/en/guides/client-side-scripts.mdx b/src/content/docs/en/guides/client-side-scripts.mdx
index 5786b9b46a0dd..1ef276d91b78a 100644
--- a/src/content/docs/en/guides/client-side-scripts.mdx
+++ b/src/content/docs/en/guides/client-side-scripts.mdx
@@ -246,3 +246,7 @@ import AstroGreet from '../components/AstroGreet.astro';
:::tip[Did you know?]
This is actually what Astro does behind the scenes when you pass props to a component written using a UI framework like React! For components with a `client:*` directive, Astro creates an `` custom element with a `props` attribute that stores your server-side props in the HTML output.
:::
+
+### Combining scripts and UI Frameworks
+
+Elements rendered by a UI framework may not be available yet when a `
+```
+:::
+
+### Dynamiczny HTML
+
+Zmienne lokalne mogą zostać użyte w funkcjach JSX-podobnych do stworzenia dynamicznie generowanych elementów HTML:
+
+```astro title="src/components/DynamicHtml.astro" "{item}"
+---
+const items = ["Pies", "Kot", "Dziobak"];
+---
+
+ {items.map((item) => (
+
{item}
+ ))}
+
+```
+
+Astro może warunkowo wyświetlać HTML używając operatorów logicznych JSX oraz wyrażeń warunkowych.
+
+```astro title="src/components/ConditionalHtml.astro" "visible"
+---
+const visible = true;
+---
+{visible &&
Pokaż mnie!
}
+
+{visible ?
Pokaż mnie!
:
W innym przypadku pokaż mnie!
}
+```
+
+### Dynamiczne Tagi
+
+Możesz również używać dynamicznych tagów przypisując nazwę tagu HTML do zmiennej lub poprzez ponowne przypisanie importu komponentu:
+
+```astro title="src/components/DynamicTags.astro" /Element|(?Cześć!
+
+```
+
+Kiedy używasz dynamicznych tagów, pamiętaj o kilku rzeczach:
+
+- **Nazwy zmiennych pisz z dużej litery.** Na przykład, użyj `Element`, a nie `element`. W przeciwnym razie Astro wyrenderuje Twoją nazwę zmiennej jako zwykły tag HTML.
+{/* TODO: Gdy pojawi się tłumaczenie trzeba zmienić ścieżkę */}
+- **Dyrektywy nawadniania nie są wspierane** Jeśli korzystasz z [dyrektyw nawadniania `client:*`](/pl/guides/framework-components/#hydrating-interactive-components), Astro musi wiedzieć, który komponent zapakować na produkcję, a wzór dynamicznego tagu zapobiega jemu działaniu.
+
+- **[Dyrektywa define:vars](/pl/reference/directives-reference/#definevars) nie jest wspierana.** Jeśli nie możesz owinąć elementów potomnych dodatkowym elementem (np. `
`), możesz ręcznie dodać ``style={`--myVar:${value}`}`` do swojego elementu.
+
+### Fragmenty
+
+Astro wspiera używanie `` bądź skróconej formy `<> `.
+
+Fragmenty mogą być użyte do uniknięcia dodawania elementów pakujących, kiedy dodajesz [dyrektywy `set:*`](/pl/reference/directives-reference/#sethtml), jak w poniższym przykładzie:
+
+```astro title="src/components/SetHtml.astro" "Fragment"
+---
+const htmlString = '
Surowa zawartość HTML
';
+---
+
+```
+
+### Różnice między Astro a JSX
+
+Składnia komponentu Astro jest nadzbiorem HTML. Została zaprojektowana tak, aby była znajoma dla każdego, kto ma doświadczenie w HTML lub JSX, jednak istnieje kilka kluczowych różnic między plikami .astro a JSX.
+
+#### Atrybuty
+
+W Astro używasz standardowego formatu `kebab-case` dla wszystkich atrybutów HTML zamiast `camelCase` używanego w JSX. Działa to nawet dla `klas`, które nie są obsługiwane przez React.
+
+```jsx del={1} ins={2} title="example.astro"
+
+
+```
+
+#### Wiele Elementów
+
+Szablon komponentu Astro może renderować wiele elementów bez potrzeby zawarcia wszystkiego w jednym tagu `
` lub `<>`, inaczej niż w JavaScript czy JSX.
+
+```astro title="src/components/RootElements.astro"
+---
+// Szablon z wieloma elementami
+---
+
Nie ma potrzeby zawierania elementów w jednym kontenerze.
+
Astro wspiera wiele elementów root w szablonie.
+```
+
+#### Komentarze
+
+W Astro możesz używać standardowych komentarzy HTML lub komentarza w stylu JavaScript.
+
+```astro title="example.astro"
+---
+---
+
+{/* Tak samo jak i składnia JS */}
+```
+
+:::caution
+Komentarze w stylu HTML zostaną dołączone do DOM przeglądarki, podczas gdy te w stylu JS zostaną pominięte. Aby zostawić wiadomości TODO lub inne wyjaśnienia tylko dla deweloperów, możesz użyć komentarzy w stylu JavaScript.
+:::
diff --git a/src/content/docs/pl/basics/layouts.mdx b/src/content/docs/pl/basics/layouts.mdx
new file mode 100644
index 0000000000000..ead0a20b3de08
--- /dev/null
+++ b/src/content/docs/pl/basics/layouts.mdx
@@ -0,0 +1,255 @@
+---
+title: Layout
+description: Wstęp do layout'ów, typu komponentu Astro który jest wpółdzielony między stronami dla wspólnych layout'ów.
+i18nReady: true
+---
+
+import ReadMore from '~/components/ReadMore.astro'
+
+**Layouty** to [komponenty Astro](/pl/basics/astro-components/) używane do tworzenia ponownie używalnej struktury UI, takiej jak szablon strony.
+
+Umownie korzystamy z terminu "layout" dla komponentów, które zapewniają wspólne elementy interfejsu wspóldzielone na stronach, takie jak stopki, nagłówki czy nawigacja. Najczęściej layout przekazuje [stronom Astro, Markdown bądź MDX](/pl/basics/astro-pages/):
+- **powłokę strony** (tagi ``, `` i ``)
+- tag [**``**](/pl/basics/astro-components/#sloty) aby okreslić miejsce gdzie treść ma zostać wstrzyknięta.
+
+{/* TODO: Gdy pojawi się tłumaczenie trzeba zmienić ścieżkę */}
+Ale w komponencie układu nie ma nic szczególnego! Layouty mogą [akceptować propy](/pl/basics/astro-components/#propy-w-komponentach) oraz [importować i korzystać z innych komponentów](/pl/basics/astro-components/#struktura-komponentu) jak każdy inny komponent Astro. Potrafią też zawierać w sobie [komponenty frameworków UI](/pl/guides/framework-components/) i [skrypty client-side](/pl/guides/client-side-scripts/). Nie muszą nawet posiadać całej powłoki strony, a jedynie być wykorzystywane jako cząstkowe szablony UI.
+
+Jednakże, jeśli komponent layout'u zawiera powłokę strony, to jego tag `` musi być elementem nadrzędnym wszystkich innych elementów. Wszystkie znaczniki [`
+
+```
+
+```astro title="src/pages/index.astro"
+---
+import MySiteLayout from '../layouts/MySiteLayout.astro';
+---
+
+
Hej, to moja zawartość strony w layout'cie!
+
+```
+
+Dowiedz się więcej o [slotach](/pl/basics/astro-components/#sloty).
+
+## Używanie TypeScript w layout'ach
+
+Każdy layout Astro można zmodyfikować tak, aby wprowadzić bezpieczeństwo typów i automatyczne uzupełnianie, podając typy dla swoich propów:
+
+```astro ins={2-7} title="src/components/MyLayout.astro"
+---
+interface Props {
+ title: string;
+ description: string;
+ publishDate: string;
+ viewCount: number;
+}
+const { title, description, publishDate, viewCount } = Astro.props;
+---
+
+
+
+
+ {title}
+
+
+
+
Opublikowano {publishDate}
+
Wyświetlone przez {viewCount} osób
+
+
+
+
+
+
+```
+
+## Layouty Markdown
+
+Layouty stron są szczególnie użyteczne w przypadku pojedynczych stron Markdown, które w innym wypadku nie miałyby żadnego formatowania.
+
+Astro udostępnia specjalną właściwość frontmatter `layout`, która pozwala określić, który komponent `.astro` ma zostać użyty jako layout strony. Domyślnie ten określony komponent może automatycznie odbierać dane z pliku Markdown.
+
+```markdown title="src/pages/page.md" {2}
+---
+layout: ../layouts/BlogPostLayout.astro
+title: "Witaj świecie!"
+author: "Matthew Phillips"
+date: "09 Aug 2022"
+---
+Wszystkie właściwości frontmatter są dostępne jako propy dla komponentu layout'u Astro.
+
+Właściwość `layout` jest jedyną specjalną, którą udostępnia Astro.
+
+Możesz ją używać w swoich plikach Markdown znajdujących się w `src/pages/`.
+
+```
+
+Typowy layout strony Markdown zawiera:
+
+1. Prop `frontmatter` umożliwiający dostęp do frontmatteru strony Markdown i innych danych.
+2. Domyślny tag [``](/pl/basics/astro-components/#sloty) wskazujący miejsce, gdzie ma wyrenderować się zawartość strony Markdown.
+
+```astro title="src/layouts/BlogPostLayout.astro" /(?"
+---
+// 1. Prop frontmatter umożliwia dostęp do frontmatteru strony Markdown i innych danych.
+const { frontmatter } = Astro.props;
+---
+
+
+
+ {frontmatter.title}
+
+
+
+
{frontmatter.title} przez {frontmatter.author}
+
+
+
Napisane dnia: {frontmatter.date}
+
+
+```
+{/* TODO: Gdy pojawi się tłumaczenie Props trzeba zmienić ścieżkę */}
+Możesz ustawić [typ `Props`](/pl/guides/typescript/#component-props) layout'u z pomocnikiem `MarkdownLayoutProps`:
+
+```astro title="src/layouts/BlogPostLayout.astro" ins={2,4-9}
+---
+import type { MarkdownLayoutProps } from 'astro';
+
+type Props = MarkdownLayoutProps<{
+ // Tu zdefiniuj propy frontmatteru
+ title: string;
+ author: string;
+ date: string;
+}>;
+
+// Teraz, `frontmatter`, `url`, i inne właściwości layout'u Markdown
+// są dostępne z bezpiecznymi typami.
+const { frontmatter, url } = Astro.props;
+---
+
+
+
+ {frontmatter.title}
+
+
+
{frontmatter.title} przez {frontmatter.author}
+
+
Napisane dnia: {frontmatter.date}
+
+
+```
+
+### Propy layout'u Markdown
+
+Layout Markdown będzie miał dostęp do tych informacji dzięki `Astro.props`:
+
+- **`file`** - Ścieżka absolutna do pliku (np. `/home/user/projects/.../file.md`).
+- **`url`** - Adres URL strony (np. `/pl/guides/markdown-content`).
+- **`frontmatter`** - Każdy element frontmatter z dokumentów Markdown lub MDX.
+ - **`frontmatter.file`** - Taka sama jak właściwość `file` najwyższego poziomu.
+ - **`frontmatter.url`** - Taka sama jak właściwość `url` najwyższego poziomu.
+- **`headings`** - Lista nagłówków (`h1 -> h6`) w dokumencie Markdown lub MDX z powiązanymi metadanymi. Ta lista jest zgodna z typem: `{ depth: number; slug: string; text: string }[]`.
+- **`rawContent()`** - Funkcja zwracająca surowy dokument Markdown jako ciąg znaków.
+- **`compiledContent()`** - Funkcja zwracająca dokument Markdown skompilowany do ciągu HTML.
+{/* TODO: Gdy pojawi się tłumaczenie Props trzeba zmienić ścieżkę */}
+:::note
+Layout Markdown będzie miał dostęp do wszystkich [dostępnych właściwości](/pl/guides/markdown-content/#available-properties) pliku Markdown z `Astro.props` **z dwoma kluczowymi różnicami**:
+
+* Informacje o nagłówku (czyli elementy `h1 -> h6`) są dostępne za pomocą tablicy `headings`, a nie funkcji `getHeadings()`.
+
+* `file` i `url` *także* są dostępne jako zagnieżdżone właściwości `frontmatter` (czyli `frontmatter.url` i `frontmatter.file`).
+
+:::
+
+### Importowanie layout'ów ręcznie (MDX)
+
+Możesz również użyć specjalnej właściwości `layout` w frontmatter plików MDX, aby przekazać `frontmatter` i `headings` bezpośrednio do określonego komponentu layout'u w ten sam sposób.
+
+Aby przekazać informacje do layout'u MDX, które nie istnieją (lub nie mogą istnieć) w Twoim frontmatter, możesz zamiast tego zaimportować i użyć komponentu ``. Działa to jak każdy inny komponent Astro i nie otrzyma automatycznie żadnych propów. Przekaż mu niezbędne propy bezpośrednio:
+
+
+```mdx title="src/pages/posts/first-post.mdx" ins={6} del={2} // //
+---
+layout: ../../layouts/BaseLayout.astro
+title: 'Mój pierwszy post MDX'
+publishDate: '21 Wrzesień 2022'
+---
+import BaseLayout from '../../layouts/BaseLayout.astro';
+
+export function fancyJsHelper() {
+ return "Spróbuję to zrobić za pomocą YAML'a!";
+}
+
+
+ Witaj na moim nowym Astro blogu MDX!
+
+```
+
+Potem Twoje wartości będą dostępne dla Ciebie poprzez `Astro.props` w layout'cie, a Twoja zawartość MDX zostanie wstrzyknięta na stronę tam, gdzie jest napisany komponent ``:
+
+
+```astro title="src/layouts/BaseLayout.astro" /{?title}?/ "fancyJsHelper" "{fancyJsHelper()}"
+---
+const { title, fancyJsHelper } = Astro.props;
+---
+
+
{title}
+
+
{fancyJsHelper()}
+
+```
+
+Więcej informacji na temat obsługi języków Markdown i MDX w Astro znajdziesz w naszym [poradniku Markdown](/pl/guides/markdown-content/).
+
+## Zagnieżdżanie layout'ów
+
+Komponenty layout'u nie muszą zawierać całej strony HTML. Możesz podzielić swoje Layouty na mniejsze komponenty, a następnie łączyć je, aby stworzyć jeszcze bardziej elastyczne szablony stron. Ten wzorzec jest przydatny, gdy chcesz współdzielić kod między wieloma layout'ami.
+
+Dla przykładu, layout `BlogPostLayout.astro` mógłby stylować tytuł, datę i autora posta. Następnie, globalny layout `BaseLayout.astro` mógłby obsługiwać resztę szablonu strony, takie jak nawigację, stopki, tagi meta SEO, globalne style i czcionki. Możesz również przekazać propy otrzymane z Twojego posta do innego layout'u, tak jak każdy inny zagnieżdzony komponent.
+
+```astro {3} // //
+---
+// src/layouts/BlogPostLayout.astro
+import BaseLayout from './BaseLayout.astro';
+const { frontmatter } = Astro.props;
+---
+
+
{frontmatter.title}
+
Autor posta: {frontmatter.author}
+
+
+```
\ No newline at end of file
diff --git a/src/content/docs/pl/basics/project-structure.mdx b/src/content/docs/pl/basics/project-structure.mdx
new file mode 100644
index 0000000000000..19d70bfc027ce
--- /dev/null
+++ b/src/content/docs/pl/basics/project-structure.mdx
@@ -0,0 +1,131 @@
+---
+title: Struktura projektu
+description: Naucz się, jak zorganizować projekt z Astro.
+i18nReady: true
+---
+import { FileTree } from '@astrojs/starlight/components';
+
+Twój nowy projekt Astro wygenerowany dzięki kreatorowi CLI `create astro` już zawiera kilka plików i folderów. Inne stworzysz już sam i dodasz je do istniejącej struktury plików Astro.
+
+Poniżej przedstawimy Ci w jaki sposób projekt Astro jest zorganizowany oraz jakie pliki znajdziesz w swoim nowym projekcie.
+
+## Foldery i Pliki
+
+Astro wykorzystuje z góry narzuconą strukturę folderów dla Twojego projektu. Każdy główny folder projektu Astro powinien zawierać następujące foldery i pliki:
+
+- `src/*` - Kod źródłowy Twojego projektu. (komponenty, strony, style, itp.)
+- `public/*` - Twoje nieprzetworzone, pozaprogramowe zasoby. (fonty, ikony, itp.)
+- `package.json` - Manifest projektu.
+- `astro.config.mjs` - Plik konfiguracyjny Astro. (zalecany)
+- `tsconfig.json` - Plik konfiguracyjny TypeScript. (zalecany)
+
+### Przykładowe Drzewko Projektu
+
+Standardowy folder projektu Astro może wyglądać tak:
+
+
+- public/
+ - robots.txt
+ - favicon.svg
+ - social-image.png
+- src/
+ - components/
+ - Header.astro
+ - Button.jsx
+ - layouts/
+ - PostLayout.astro
+ - pages/
+ - posts/
+ - post1.md
+ - post2.md
+ - post3.md
+ - index.astro
+ - styles/
+ - global.css
+- astro.config.mjs
+- package.json
+- tsconfig.json
+
+
+### `src/`
+
+Folder `src/` to miejsce, gdzie żyje większość kodu źródłowego Twojego projektu. Zawiera on:
+
+- [Strony](/pl/basics/astro-pages/)
+- [Layouty](/pl/basics/layouts/)
+- [Komponenty Astro](/pl/basics/astro-components/)
+- [Komponenty frameworków UI (React, itp.)](/pl/guides/framework-components/)
+- [Style (CSS, Sass)](/pl/guides/styling/)
+- [Pliki Markdown](/pl/guides/markdown-content/)
+
+Astro przetwarza, optymalizuje i pakuje Twoje pliki z folderu `src/` aby stworzyć finalną stronę internetową, która wysyłana jest do przeglądarki. W przeciwieństwie do statycznego folderu `public/` zawartość `src/` jest budowana i obsługiwana przez Astro.
+
+Niektóre pliki (takie jak komponenty Astro) nie są nawet wysyłane w swojej postaci, tylko renderowane jako statyczny HTML. Inne pliki (jak CSS) są przesyłane do przeglądarki ale mogą być zoptymalizowane bądź spakowane z innymi plikami CSS dla lepszej wydajności.
+
+:::tip
+Podczas gdy ten przewodnik opisuje niektóre popularne zasady użyte przez społeczność Astro, to jedynymi folderami zarezerwowanymi przez samo Astro są `src/pages/` i `src/content/`. Masz wolną rękę aby zmieniać nazwy i zmieniać układ innych folderów w taki sposób, który jest dla Ciebie najlepszy.
+:::
+
+### `src/components`
+
+**Komponenty** są jednostkami wielekrotnego użytku dla Twoich stron HTML. Mogą być one [komponentami Astro](/pl/basics/astro-components/), lub [komponentami frameworków UI](/pl/guides/framework-components/) jak React bądź Vue. Powszechne jest aby grupować i organizować wszystkie komponenty Twojego folderu w tym folderze.
+
+To jest powszechnie przyjęta praktyka w projektach Astro, lecz nie jest ona wymagana. Możesz dowolnie organizować swoje komponenty według własnych życzeń!
+
+### `src/content`
+
+Folder `src/content/` ma na celu przechowywanie [kolekcji zawartości](/pl/guides/content-collections/) i ich opcjonalne pliki konfiguracji. Żadne inne pliki nie mają prawa tu być.
+
+### `src/layouts`
+
+[Layouty](/pl/basics/layouts/) to komponenty Astro, które definiują strukturę UI współdzieloną przez jedną lub więcej [stron](/pl/basics/astro-pages/).
+
+Tak jak `src/components`, ten folder to znana, ale niewymagana konwencja.
+
+### `src/pages`
+
+[Strony](/pl/basics/astro-pages/) są specjalnym rodzajem komponentu, dzięki którym stworzysz nowe podstrony swojej witryny. Strona może być komponentem Astro bądź plikiem Markdown, który reprezentuje jakąś część zawartości Twojego portalu.
+
+:::caution
+`src/pages` to **wymagany** podfolder Twojego projektu Astro. Bez tego Twoja strona nie będzie miała żadnych stron czy ścieżek!
+:::
+
+### `src/styles`
+
+Powszechnym zamysłem jest przechowywanie Twoich plików CSS bądź Sass w `src/styles`, ale nie jest on konieczny. Tak długo, jak Twoje style znajdują się gdziekolwiek w katalogu src/ i są poprawnie importowane, Astro zajmie się ich obsługą i optymalizacją.
+
+### `public/`
+
+Folder `public/` jest dla plików i zasobów Twojego projektu, które nie muszą być przetworzone podczas procesu budowania Astro. Pliki z tego folderu będą skopiowane do folderu budowania w stanie nienaruszonym, a po tym Twoja strona zostanie stworzona.
+
+Takie zachowanie sprawia, że `public/` jest idealnym miejscem na podstawowe zasoby jak zdjęcia czy fonty, lub dla specjalnych plików takich jak `robots.txt` i `manifest.webmanifest`.
+
+Możesz umieścić w `public/` pliki CSS i JavaScript, ale pamiętaj, że te pliki nie będą zoptymalizowane ani spakowane w Twoim finalnym projekcie.
+
+:::tip
+Ogólnie przyjmując, każdy plik CSS lub JavaScript napisany przez Ciebie powinien się znajdować w folderze `src/`.
+:::
+
+### `package.json`
+
+Ten plik jest używany przez paczkę mendedżerów pakietów to zarządzania Twoimi zależnościami. Definiuje również powszechnie użyte skrypty do uruchamiania Astro (np. `npm start`, `npm run build`).
+
+Znajdują się tu [dwa typy zależności](https://docs.npmjs.com/specifying-dependencies-and-devdependencies-in-a-package-json-file), które możesz określić jako `package.json`: `dependencies` i `devDependencies`. W większości przypadków oba pracują tak samo: Astro potrzebuje wszelkie zależności podczas budowy, a Twój menedżer paczki je zainstaluje. Zalecamy przechowywanie wszystkich Twoich zależności w `dependencies` na początek, oraz używać jedynie `devDependencies` gdy najdzie taka specyficzna potrzeba.
+
+Aby wesprzeć tworzenie nowego pliku `package.json` dla Twojego projektu, sprawdź instrukcję [ręcznej instalacji](/pl/install-and-setup/#instalacja-ręczna).
+
+### `astro.config.mjs`
+
+Ten plik jest wygenerowany w każdym startowym szablonie i zawiera opcje konfiguracji dla Twojego projektu Astro. Tutaj możesz określić opcje budowania, opcje serwera, jakich integracji użyć i wiele więcej.
+
+Astro wspiera kilka formatów dla pliku konfiguracyjnego JavaScriptu: `astro.config.js`, `astro.config.mjs`, `astro.config.cjs` i `astro.config.ts`. Polecamy korzystanie z `.mjs` w większości przypadków, oraz z `.ts` w razie pisania w TypeScript.
+
+Ładowanie pliku konfiguracyjnego TypeScript jest obsługiwane przez [`tsm`](https://github.com/lukeed/tsm) i będzie zwracał szczególną uwagę na Twoje opcje `tsconfig`.
+
+Zerknij na [Przewodnik Konfiguracji Astro](/pl/guides/configuring-astro/) aby poznać szczegóły opcji konfiguracyjnych.
+
+### `tsconfig.json`
+
+Ten plik jest generowany w każdym szablonie startowym i zawiera on opcje konfiguracji TypeScript dla Twojego projektu Astro. Niektóre funkcje (takie jak importy pakietów npm) nie są w pełni obsługiwane w edytorze bez pliku `tsconfig.json`.
+
+Szczegóły dotyczące ustawień konfiguracji znajdziesz w [Przewodniku TypeScript](/pl/guides/typescript/).
diff --git a/src/content/docs/pl/guides/upgrade-to/v2.mdx b/src/content/docs/pl/guides/upgrade-to/v2.mdx
index 6be55798ccd73..f6497cdb393e5 100644
--- a/src/content/docs/pl/guides/upgrade-to/v2.mdx
+++ b/src/content/docs/pl/guides/upgrade-to/v2.mdx
@@ -381,13 +381,13 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
### Zaktualizowano: Vite 4
-Astro v2.0 aktualizuje się z Vite 3 do [Vite 4](https://vitejs.dev/), wydanego w grudniu 2022 r.
+Astro v2.0 aktualizuje się z Vite 3 do [Vite 4](https://vite.dev/), wydanego w grudniu 2022 r.
#### Co powinienem zrobić?
Nie powinny być potrzebne żadne zmiany w twoim kodzie! Zajęliśmy się większością aktualizacji w Astro; jednakże, niektóre subtelne zachowania Vite mogą się wciąż zmieniać między wersjami.
-Zajrzyj do oficjalnego [Przewodnika Migracji Vite](https://vitejs.dev/guide/migration.html) jeśli napotkasz problemy.
+Zajrzyj do oficjalnego [Przewodnika Migracji Vite](https://vite.dev/guide/migration.html) jeśli napotkasz problemy.
## Flagi eksperymentalne Astro v2.0 zostały usunięte
diff --git a/src/content/docs/pl/guides/upgrade-to/v4.mdx b/src/content/docs/pl/guides/upgrade-to/v4.mdx
index 01dbf3c1efa4e..047f823cfacf5 100644
--- a/src/content/docs/pl/guides/upgrade-to/v4.mdx
+++ b/src/content/docs/pl/guides/upgrade-to/v4.mdx
@@ -86,7 +86,7 @@ W Astro v3.0, Vite 4 był używany jako serwer deweloperski i bundler produkcyjn
Astro v4.0 aktualizuje z Vite 4 do Vite 5.
#### Co powinienem zrobić?
-Jeśli używasz wtyczek, konfiguracji lub API specyficznych dla Vite, sprawdź [przewodnik migracyjny Vite](https://vitejs.dev/guide/migration) w celu sprawdzenia zmian powodujących problemy i zaktualizuj swój projekt w razie potrzeby. W Astro samym w sobie nie ma zmian powodujących problemy.
+Jeśli używasz wtyczek, konfiguracji lub API specyficznych dla Vite, sprawdź [przewodnik migracyjny Vite](https://vite.dev/guide/migration) w celu sprawdzenia zmian powodujących problemy i zaktualizuj swój projekt w razie potrzeby. W Astro samym w sobie nie ma zmian powodujących problemy.
### Uaktualnione: jednolite zależności dla remark i rehype
@@ -383,4 +383,4 @@ Znasz jakieś dobre źródło zasobów dla Astro v4.0? [Edytuj tę stronę](http
## Znane problemy
-Proszę sprawdź [problemy Astro na GitHubie](https://github.com/withastro/astro/issues/) w celu sprawdzenia zgłoszonych problemów lub zgłoszenia nowego problemu.
\ No newline at end of file
+Proszę sprawdź [problemy Astro na GitHubie](https://github.com/withastro/astro/issues/) w celu sprawdzenia zgłoszonych problemów lub zgłoszenia nowego problemu.
diff --git a/src/content/docs/pl/install-and-setup.mdx b/src/content/docs/pl/install-and-setup.mdx
index 69a5b389e0166..27e5852e64afa 100644
--- a/src/content/docs/pl/install-and-setup.mdx
+++ b/src/content/docs/pl/install-and-setup.mdx
@@ -24,7 +24,7 @@ Chcesz wypróbować Astro w przeglądarce? Odwiedź stronę [astro.new](https://
## Wspierane przeglądarki
-Astro jest budowane przy użyciu bundlera Vite, który domyślnie generuje kod dla przeglądarek obsługujących współczesny JavaScript. Aby uzyskać pełne informacje, możesz sprawdzić [listę przeglądarek aktualnie wspieranych przez Vite](https://vitejs.dev/guide/build.html#browser-compatibility).
+Astro jest budowane przy użyciu bundlera Vite, który domyślnie generuje kod dla przeglądarek obsługujących współczesny JavaScript. Aby uzyskać pełne informacje, możesz sprawdzić [listę przeglądarek aktualnie wspieranych przez Vite](https://vite.dev/guide/build.html#browser-compatibility).
## Rozpocznij nowy projekt
@@ -430,4 +430,4 @@ Jeśli nie chcesz korzystać z automatycznej inicjalizacji poleceniem CLI `creat
8. Możesz teraz [uruchomić serwer deweloperski Astro](#uruchom-serwer-deweloperski-astro) i sprawdzić podgląd Twojego projektu na żywo podczas tworzenia aplikacji!
-
\ No newline at end of file
+
diff --git a/src/content/docs/pt-br/basics/astro-components.mdx b/src/content/docs/pt-br/basics/astro-components.mdx
index e05826546f8cb..33d230273ef10 100644
--- a/src/content/docs/pt-br/basics/astro-components.mdx
+++ b/src/content/docs/pt-br/basics/astro-components.mdx
@@ -252,7 +252,7 @@ import Involucro from '../components/Involucro.astro';
Use um atributo `slot="meu-slot"` no elemento filho que você quer passar para um placeholder `` correspondente no seu componente.
:::
-Para passar múltiplos elementos HTML para um placeholder `` de um componente sem ter uma `
` envolta, use o atributo `slot=""` no [Componente `` do Astro](/pt-br/reference/api-reference/#fragment-):
+Para passar múltiplos elementos HTML para um placeholder `` de um componente sem ter uma `
` envolta, use o atributo `slot=""` no [Componente `` do Astro](/pt-br/reference/components-reference/#fragment-):
```astro title="src/components/TabelaCustomizada.astro" "" ""
---
diff --git a/src/content/docs/pt-br/basics/rendering-modes.mdx b/src/content/docs/pt-br/basics/rendering-modes.mdx
index 7ea37a8fef85a..2b53254ecbcf1 100644
--- a/src/content/docs/pt-br/basics/rendering-modes.mdx
+++ b/src/content/docs/pt-br/basics/rendering-modes.mdx
@@ -4,6 +4,7 @@ i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import RecipeLinks from '~/components/RecipeLinks.astro';
+import ReadMore from '~/components/ReadMore.astro';
O código do seu projeto Astro deve ser **renderizado** como HTML para ser exibido na Web.
@@ -39,6 +40,8 @@ Os outros dois modos de saída do Astro podem ser configurados para permitir a *
Como são geradas por visita, essas rotas podem ser personalizadas para cada usuário. Por exemplo, uma página renderizada sob demanda pode mostrar a um usuário autenticado as informações de sua conta ou exibir dados recém atualizados sem exigir um novo build completo do site. A renderização sob demanda no servidor no momento da solicitação também é conhecida como **renderização no lado do servidor (SSR)**.
+Leia mais sobre [funcionalidades disponíveis para você com renderização sob demanda e um adaptador](/pt-br/guides/server-side-rendering/#recursos-de-renderização-sob-demanda), como cookies, objetos Response e Request, streaming HTML e mais.
+
[Considere ativar o modo `server` ou `hybrid`](/pt-br/guides/server-side-rendering/#habilitando-a-renderização-no-servidor-sob-demanda) em seu projeto Astro se você precisar do seguinte:
- **Endpoints de API**: Criar páginas específicas que funcionam como endpoints de API para tarefas como acesso a banco de dados, autenticação e autorização, enquanto mantém dados sensíveis ocultos do cliente.
@@ -50,5 +53,5 @@ Como são geradas por visita, essas rotas podem ser personalizadas para cada usu
Os modos de saída `server` e `hybrid` permitem que você inclua [ilhas Astro](/pt-br/concepts/islands/) para interatividade (ou até mesmo aplicações inteiras renderizadas no lado do cliente!) no seu [framework de UI](/pt-br/guides/framework-components/) de preferência. Com [middlewares](/pt-br/guides/middleware/) e a [API de Transições de Visualização](/pt-br/guides/view-transitions/) do Astro para animações e persistência de estado na navegação entre rotas, até mesmo aplicações altamente interativas são possíveis.
:::tip
-A renderização sob demanda no lado do servidor no Astro oferece uma verdadeira experiência de aplicação sem a sobrecarga de JavaScript de um aplicação de página única no lado do cliente.
+A renderização sob demanda no lado do servidor no Astro, especialmente quando combinado com [transições de visualização](/pt-br/guides/view-transitions/), oferece uma verdadeira experiência de aplicação sem a sobrecarga de JavaScript de um aplicação de página única no lado do cliente.
:::
diff --git a/src/content/docs/pt-br/getting-started.mdx b/src/content/docs/pt-br/getting-started.mdx
index 50f972189a2de..ed4b34357faf7 100644
--- a/src/content/docs/pt-br/getting-started.mdx
+++ b/src/content/docs/pt-br/getting-started.mdx
@@ -5,10 +5,6 @@ i18nReady: true
tableOfContents: false
editUrl: false
next: false
-banner:
- content: |
- A versão 4.0 do Astro está aqui!
- Pronto para atualizar? Leia nosso guia de atualização.
hero:
title: Documentação do Astro
tagline: Guias, recursos e referências de API para te ajudar a construir com Astro.
@@ -24,6 +20,8 @@ hero:
tagline: Possível graças ao Astro e nossos contribuidores de código aberto.
linkText: Junte-se a nós!
link: /pt-br/contribute/
+banner:
+ content: Quer experimentar Astro 5 beta? Leia nosso guia de atualização v5!
---
import { CardGrid } from '@astrojs/starlight/components'
diff --git a/src/content/docs/pt-br/guides/cms.mdx b/src/content/docs/pt-br/guides/cms.mdx
index 9df2209dd6411..ba10e5d7911a6 100644
--- a/src/content/docs/pt-br/guides/cms.mdx
+++ b/src/content/docs/pt-br/guides/cms.mdx
@@ -29,6 +29,7 @@ Um CMS pode ser útil para conteúdo que segue uma estrutura particular, muitas
Seu projeto Astro pode então buscar seu conteúdo do seu CMS e mostrá-lo, onde e como você quiser no seu site.
+
## Quais CMSes funcionam bem com o Astro?
Pelo Astro tomar conta da _apresentação_ do seu conteúdo, você vai querer escolher um CMS _headless_, como aqueles na lista acima. Isso significa que o CMS te ajuda a escrever seu conteúdo, mas não gera um site que o mostra. Ao invés disso, você busca os dados do conteúdo e os utiliza no seu projeto Astro.
@@ -39,4 +40,4 @@ Alguns CMSes headless, como o Storyblok, oferecem uma [integração](/pt-br/guid
## Posso utilizar Astro sem um CMS?
-Sim! O Astro oferece formas integradas de [escrever conteúdo](/pt-br/guides/content/), incluindo suporte para páginas Markdown.
+Sim! O Astro fornece suporte embutido para [Markdown](/pt-br/guides/markdown-content/).
diff --git a/src/content/docs/pt-br/guides/configuring-astro.mdx b/src/content/docs/pt-br/guides/configuring-astro.mdx
index e5d5376f43de0..5859c99b0a49b 100644
--- a/src/content/docs/pt-br/guides/configuring-astro.mdx
+++ b/src/content/docs/pt-br/guides/configuring-astro.mdx
@@ -152,7 +152,7 @@ Astro verifica arquivos de configuração antes de carregar seus outros arquivos
Você pode utilizar `process.env` em um arquivo de configuração para acessar outras variáveis de ambiente, como aquelas [definidas pela CLI](/pt-br/guides/environment-variables/#usando-a-cli).
-Você também pode utilizar [o utilitário `loadEnv` do Vite](https://main.vitejs.dev/config/#using-environment-variables-in-config) para manualmente carregar arquivos `.env`.
+Você também pode utilizar [o utilitário `loadEnv` do Vite](https://main.vite.dev/config/#using-environment-variables-in-config) para manualmente carregar arquivos `.env`.
:::note
O `pnpm` não permite você importar módulos que não estão diretamente instalados no seu projeto. Se você está usando `pnpm`, você terá que instalar `vite` para usar o utilitário `loadEnv`.
diff --git a/src/content/docs/pt-br/guides/deploy/microsoft-azure.mdx b/src/content/docs/pt-br/guides/deploy/microsoft-azure.mdx
index 0353a20a9321d..5cb2f48b9e0da 100644
--- a/src/content/docs/pt-br/guides/deploy/microsoft-azure.mdx
+++ b/src/content/docs/pt-br/guides/deploy/microsoft-azure.mdx
@@ -4,23 +4,47 @@ description: Como fazer o deploy do seu site Astro para web utilizando Microsoft
type: deploy
i18nReady: true
---
+import { Steps } from '@astrojs/starlight/components';
[Azure](https://azure.microsoft.com/) é uma plataforma na nuvem da Microsoft. Você pode fazer deploy do seu site Astro com o serviço [Static Web Apps](https://aka.ms/staticwebapps) da Microsoft Azure.
+Este guia conduz pela publicação do seu site Astro armazenado no GitHub usando Visual Studio Code. Por favor veja os guias Microsoft para usar uma [Azure Pipelines Task](https://learn.microsoft.com/en-us/azure/devops/pipelines/tasks/reference/azure-static-web-app-v0?view=azure-pipelines) para outras configurações.
+
## Pré-requisitos
Para seguir este guia você vai precisar de:
-- Uma conta da Azure e uma chave de inscrição. Você pode criar uma [conta gratuita da Azure aqui](https://azure.microsoft.com/free).
-- Seu código no [GitHub](https://github.com/).
+- Uma conta Azure e uma chave de inscrição. Você pode criar uma [conta gratuita Azure aqui](https://azure.microsoft.com/free).
+- Seu código publicado no [GitHub](https://github.com/).
- A [Extensão SWA](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurestaticwebapps) no [Visual Studio Code](https://code.visualstudio.com/).
## Como fazer o deploy
+
1. Abra seu projeto no VS Code.
2. Abra a extensão Static Web Apps, inicie sua sessão na Azure e clique no botão **+** para criar um novo Static Web App. Será solicitado para você designar qual chave de inscrição utilizar.
-3. Siga o assistente iniciado pela extensão para dar um nome, escolher uma pré-definição de framework e designar a raiz da aplicação (geralmente `/`) e a localização de arquivos construídos `/dist`. O assistente será executado e irá criar uma [GitHub Action](https://github.com/features/actions) no seu repositório em um diretório `.github`.
+3. Siga o assistente iniciado pela extensão para dar um nome, escolher uma pré-definição de framework e designar a raiz da aplicação (geralmente `/`) e a localização de arquivos construídos `/dist`. O assistente será executado e irá criar uma [GitHub Action](https://github.com/features/actions) no seu repositório em um diretório `.github`. (Esta pasta será automaticamente criada se ela ainda não existir.)
+
A GitHub Action irá fazer deploy da sua aplicação (você pode ver seu progresso na aba Actions do seu repositório no GitHub). Ao ser completado com sucesso, você pode ver sua aplicação no endereço mostrado pela aba de progresso da Extensão SWA clicando no botão **Browse Website** (isso irá aparecer após a GitHub Action ser executada).
+
+## Erros Conhecidos
+
+O yaml da GitHub action que foi criado para você assume o uso do node 14. Isso significa que a build do Astro falhará. Para resolver isso atualize o arquivo package.json de seus projetos com o seguinte trecho de código.
+
+```
+ "engines": {
+ "node": ">=18.0.0"
+ },
+```
+
+## Recursos Oficiais
+
+- [Documentação Microsoft Azure Static Web Apps](https://learn.microsoft.com/en-us/azure/static-web-apps/)
+
+## Recursos da Comunidade
+
+- [Publicando um Website Astro com Azure Static Web Apps](https://www.blueboxes.co.uk/deploying-an-astro-website-to-azure-static-web-apps)
+- [Publicando um Site Astro estático com Azure Static Web Apps usando GitHub Actions](https://agramont.net/blog/create-static-site-astro-azure-ssg/#automate-deployment-with-github-actions)
diff --git a/src/content/docs/pt-br/guides/environment-variables.mdx b/src/content/docs/pt-br/guides/environment-variables.mdx
index 1bf8239b654e2..4e4a46440e05c 100644
--- a/src/content/docs/pt-br/guides/environment-variables.mdx
+++ b/src/content/docs/pt-br/guides/environment-variables.mdx
@@ -5,7 +5,7 @@ i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
-Astro utiliza o suporte integrado do Vite para variáveis de ambiente e o deixa [utilizar quaisquer de seus métodos](https://vitejs.dev/guide/env-and-mode.html) para trabalhar com elas.
+Astro utiliza o suporte integrado do Vite para variáveis de ambiente e o deixa [utilizar quaisquer de seus métodos](https://vite.dev/guide/env-and-mode.html) para trabalhar com elas.
Note que enquanto _todas_ as variáveis de ambiente estão disponíveis em código no lado do servidor, apenas variáveis de ambiente com o prefixo `PUBLIC_` estão disponíveis em código no lado do cliente por segurança.
@@ -54,7 +54,7 @@ SENHA_BD="foobar"
PUBLIC_POKEAPI="https://pokeapi.co/api/v2"
```
-Para mais sobre arquivos `.env`, [veja a documentação do Vite](https://vitejs.dev/guide/env-and-mode.html#env-files).
+Para mais sobre arquivos `.env`, [veja a documentação do Vite](https://vite.dev/guide/env-and-mode.html#env-files).
### Usando a CLI
Você também pode adicionar variáveis de ambiente enquanto você executa seu projeto:
@@ -121,4 +121,3 @@ interface ImportMeta {
readonly env: ImportMetaEnv;
}
```
-
diff --git a/src/content/docs/pt-br/guides/imports.mdx b/src/content/docs/pt-br/guides/imports.mdx
index a1f80d1d355db..72eb3ff54bfe5 100644
--- a/src/content/docs/pt-br/guides/imports.mdx
+++ b/src/content/docs/pt-br/guides/imports.mdx
@@ -281,7 +281,7 @@ const dados = JSON.parse(json);
## Estendendo suporte de tipos de arquivo
-Com plugins **Vite** e **Rollup** compatíveis, você pode importar tipos de arquivos que não são nativamente suportados pelo Astro. Para como encontrar os plugins que você precisa na seção [Finding Plugins](https://vitejs.dev/guide/using-plugins.html#finding-plugins) da documentação do Vite.
+Com plugins **Vite** e **Rollup** compatíveis, você pode importar tipos de arquivos que não são nativamente suportados pelo Astro. Para como encontrar os plugins que você precisa na seção [Finding Plugins](https://vite.dev/guide/using-plugins.html#finding-plugins) da documentação do Vite.
:::note[configuração de plugins]
diff --git a/src/content/docs/pt-br/guides/markdown-content.mdx b/src/content/docs/pt-br/guides/markdown-content.mdx
index 93861e4395d07..8f69ae0102096 100644
--- a/src/content/docs/pt-br/guides/markdown-content.mdx
+++ b/src/content/docs/pt-br/guides/markdown-content.mdx
@@ -570,8 +570,8 @@ export default defineConfig({
Astro vem com suporte nativo para [Shiki](https://shiki.matsu.io/) e [Prism](https://prismjs.com/). Isso fornece syntax highlighting para:
- todas as code fences (\`\`\`) usadas em um arquivo Markdown ou MDX.
-- conteúdo dentro do [componente `` nativo](/pt-br/reference/api-reference/#code-) (oferecido por Shiki).
-- conteúdo dentro do [componente ``](/pt-br/reference/api-reference/#prism-) (oferecido por Prism).
+- conteúdo dentro do [componente `` nativo](/pt-br/reference/components-reference/#code-) (oferecido por Shiki).
+- conteúdo dentro do [componente ``](/pt-br/reference/components-reference/#prism-) (oferecido por Prism).
Shiki é ativado por padrão, pré-configurado com o tema `github-dark`. A saída compilada será limitada a `style`s inline sem classes CSS de fora, folhas de estilo ou JS no lado do cliente.
diff --git a/src/content/docs/pt-br/guides/rss.mdx b/src/content/docs/pt-br/guides/rss.mdx
index 40cdedf3f1311..f6fbea984c98d 100644
--- a/src/content/docs/pt-br/guides/rss.mdx
+++ b/src/content/docs/pt-br/guides/rss.mdx
@@ -126,7 +126,7 @@ export const collections = { blog };
-Para criar um feed RSS a partir de documentos em `src/pages/`, utilize o utilitário `pagesGlobToRssItems()`. Ele aceita um resultado de [`import.meta.glob`](https://vitejs.dev/guide/features.html#glob-import) e devolve um array de itens de feed RSS válidos (veja [mais sobre como escrever padrões de glob](/pt-br/guides/imports/#padrões-de-glob) para especificar quais páginas incluir).
+Para criar um feed RSS a partir de documentos em `src/pages/`, utilize o utilitário `pagesGlobToRssItems()`. Ele aceita um resultado de [`import.meta.glob`](https://vite.dev/guide/features.html#glob-import) e devolve um array de itens de feed RSS válidos (veja [mais sobre como escrever padrões de glob](/pt-br/guides/imports/#padrões-de-glob) para especificar quais páginas incluir).
:::caution
Essa função assume, mas não verifica, que todas as propriedades necessárias do feed estão presentes no frontmatter de cada documento. Se você encontrar erros, verifique o frontmatter de cada página manualmente.
diff --git a/src/content/docs/pt-br/guides/styling.mdx b/src/content/docs/pt-br/guides/styling.mdx
index eac2b15b7318b..f4374c2ae77e4 100644
--- a/src/content/docs/pt-br/guides/styling.mdx
+++ b/src/content/docs/pt-br/guides/styling.mdx
@@ -212,7 +212,7 @@ import 'nome-do-pacote/estilos.css';
Se seu pacote **não recomenda usar uma extensão de arquivo** (ex.: `nome-do-pacote/estilos`), antes, você vai precisar atualizar sua configuração Astro!
-Digamos que você está importando um arquivo CSS de um `nome-do-pacote` chamado `normalize` (com a extensão omitida). Para garantir que nós podemos pré-renderizar sua página corretamente, adicione `nome-do-pacote` para [o array vite.ssr.noExternal](https://vitejs.dev/config/ssr-options.html#ssr-noexternal):
+Digamos que você está importando um arquivo CSS de um `nome-do-pacote` chamado `normalize` (com a extensão omitida). Para garantir que nós podemos pré-renderizar sua página corretamente, adicione `nome-do-pacote` para [o array vite.ssr.noExternal](https://vite.dev/config/ssr-options.html#ssr-noexternal):
```js ins={7}
// astro.config.mjs
@@ -228,7 +228,7 @@ export default defineConfig({
```
:::note
-Isso é uma [configuração específica do Vite](https://vitejs.dev/config/ssr-options.html#ssr-noexternal) que não tem relação com (ou necessita de) [SSR do Astro](/pt-br/guides/server-side-rendering/).
+Isso é uma [configuração específica do Vite](https://vite.dev/config/ssr-options.html#ssr-noexternal) que não tem relação com (ou necessita de) [SSR do Astro](/pt-br/guides/server-side-rendering/).
:::
Agora, você está livre para importar `nome-do-pacote/normalize`. Isto passará por bundle e será otimizado pelo Astro como qualquer outra folha de estilos local.
@@ -492,7 +492,7 @@ Você pode também usar todos os pré-processadores CSS listados acima dentro de
## PostCSS
-Astro vem com PostCSS incluído como parte de [Vite](https://vitejs.dev/guide/features.html#postcss). E para configurar PostCSS para seu projeto, crie um arquivo `postcss.config.cjs` na raiz de seu projeto. Você pode importar plugins usando `require()` após os instalar (por exemplo `npm install autoprefixer`).
+Astro vem com PostCSS incluído como parte de [Vite](https://vite.dev/guide/features.html#postcss). E para configurar PostCSS para seu projeto, crie um arquivo `postcss.config.cjs` na raiz de seu projeto. Você pode importar plugins usando `require()` após os instalar (por exemplo `npm install autoprefixer`).
```js title="postcss.config.cjs" ins={3-4}
module.exports = {
@@ -591,7 +591,7 @@ import estilosCSSBruto from '../estilos/principal.css?raw';
```
-Veja a [documentação do Vite](https://vitejs.dev/guide/assets.html#importing-asset-as-string) para detalhes completos.
+Veja a [documentação do Vite](https://vite.dev/guide/assets.html#importing-asset-as-string) para detalhes completos.
### Importação de CSS com `?url`
Para casos de uso avançado, você pode importar uma referência URL direta para um arquivo CSS dentro de seu projeto no diretório `src/`. Isto pode ser útil quando você necessita de controle completo sobre como um arquivo é incluído na página. Entretanto, isto vai prevenir a otimização desse arquivo CSS com o resto do CSS da sua página.
@@ -599,7 +599,7 @@ Para casos de uso avançado, você pode importar uma referência URL direta para
Isto não é recomendável para a maioria dos usuários. Em vez disso, coloque os arquivos CSS dentro de `public/` para conseguir uma referência URL consistente.
:::caution
-Importar um arquivo CSS menor com `?url` talvez retorne o conteúdo dos arquivos CSS codificado em base64 como uma URL de dados, mas somente em sua build final. Sendo assim, você pode escrever seu código com suporte para URLs codificadas (`data:text/css;base64,...`) ou configurar a opção [`vite.build.assetsInlineLimit`](https://vitejs.dev/config/#build-assetsinlinelimit) para `0` para desabilitar esta funcionalidade.
+Importar um arquivo CSS menor com `?url` talvez retorne o conteúdo dos arquivos CSS codificado em base64 como uma URL de dados, mas somente em sua build final. Sendo assim, você pode escrever seu código com suporte para URLs codificadas (`data:text/css;base64,...`) ou configurar a opção [`vite.build.assetsInlineLimit`](https://vite.dev/config/#build-assetsinlinelimit) para `0` para desabilitar esta funcionalidade.
:::
```astro title="src/components/UrlEstilosBrutos.astro" "?url"
@@ -611,7 +611,7 @@ import urlEstilos from '../estilos/principal.css?url';
```
-Veja a [documentação do Vite](https://vitejs.dev/guide/assets.html#importing-asset-as-url) para detalhes completos.
+Veja a [documentação do Vite](https://vite.dev/guide/assets.html#importing-asset-as-url) para detalhes completos.
[less]: https://lesscss.org/
@@ -619,6 +619,6 @@ Veja a [documentação do Vite](https://vitejs.dev/guide/assets.html#importing-a
[stylus]: https://stylus-lang.com/
[svelte-style]: https://svelte.dev/docs#component-format-style
[tailwind]: /pt-br/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
diff --git a/src/content/docs/pt-br/guides/troubleshooting.mdx b/src/content/docs/pt-br/guides/troubleshooting.mdx
index 124a649f1ed4f..0a1ffc1cbe7c8 100644
--- a/src/content/docs/pt-br/guides/troubleshooting.mdx
+++ b/src/content/docs/pt-br/guides/troubleshooting.mdx
@@ -34,7 +34,7 @@ Isso pode ser útil para depurar diferenças entre a saída do SSR e os componen
### Componente `` do Astro
-Para ajudar na depuração de seus componentes Astro, o Astro fornece um componente embutido [``](/pt-br/reference/api-reference/#debug-) que renderiza qualquer valor diretamente em seu modelo HTML de componente. Isso é útil para depuração rápida no navegador sem precisar alternar entre o terminal e o navegador.
+Para ajudar na depuração de seus componentes Astro, o Astro fornece um componente embutido [``](/pt-br/reference/components-reference/#debug-) que renderiza qualquer valor diretamente em seu modelo HTML de componente. Isso é útil para depuração rápida no navegador sem precisar alternar entre o terminal e o navegador.
```astro {2,7}
---
@@ -158,7 +158,7 @@ Por exemplo, utilize `../components/**/*.js` em `src/pages/index.astro` para imp
`Astro.glob()` não suporta variáveis dinâmicas e interpolação de strings.
-Isto não é um bug no Astro. Isso acontece por conta de uma limitação na [função `import.meta.glob()` do Vite](https://vitejs.dev/guide/features.html#glob-import) que apenas suporta string literals estáticas.
+Isto não é um bug no Astro. Isso acontece por conta de uma limitação na [função `import.meta.glob()` do Vite](https://vite.dev/guide/features.html#glob-import) que apenas suporta string literals estáticas.
Uma solução comum é no lugar importar um largo conjunto de arquivos que inclui todos os arquivos que você precisa utilizando `Astro.glob()` e então os filtrar:
diff --git a/src/content/docs/pt-br/guides/typescript.mdx b/src/content/docs/pt-br/guides/typescript.mdx
index 38bb2811e89ec..4e8180ba12621 100644
--- a/src/content/docs/pt-br/guides/typescript.mdx
+++ b/src/content/docs/pt-br/guides/typescript.mdx
@@ -29,7 +29,7 @@ Para herdar de um dos templates, utilize [a opção `extends`](https://www.types
}
```
-Adicionalmente, nossos templates incluem um arquivo `env.d.ts` dentro do diretório `src` para providenciar [tipos de cliente do Vite](https://vitejs.dev/guide/features.html#client-types) para seu projeto:
+Adicionalmente, nossos templates incluem um arquivo `env.d.ts` dentro do diretório `src` para providenciar [tipos de cliente do Vite](https://vite.dev/guide/features.html#client-types) para seu projeto:
```typescript title="env.d.ts"
///
diff --git a/src/content/docs/pt-br/guides/upgrade-to/v2.mdx b/src/content/docs/pt-br/guides/upgrade-to/v2.mdx
index c8838a72a5d26..44c8f4ac8b8e6 100644
--- a/src/content/docs/pt-br/guides/upgrade-to/v2.mdx
+++ b/src/content/docs/pt-br/guides/upgrade-to/v2.mdx
@@ -5,7 +5,7 @@ i18nReady: true
---
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro'
import { FileTree } from '@astrojs/starlight/components';
-
+import { Steps } from '@astrojs/starlight/components';
Este guia irá ajudá-lo a migrar seu projeto do Astro v1 para Astro v2.
@@ -61,6 +61,7 @@ Astro v2.0 remove suporte para Node 14 completamente, para que todos os usuário
Verifique seu ambos seu ambiente de desenvolvimento e de deploy estão utilizando **Node `16.12.0` ou posterior**.
+
1. Verifique sua versão local do Node utilizando:
```sh
@@ -69,11 +70,10 @@ Verifique seu ambos seu ambiente de desenvolvimento e de deploy estão utilizand
```
Se o seu ambiente de desenvolvimento local precisa ser atualizado, [instale o Node](https://nodejs.org/en/download/).
-
2. Verifique a própria documentação do seu [ambiente de deploy](/pt-br/guides/deploy/) para verificar que eles suportam Node 16.
Você pode especificar Node `16.12.0` para o seu projeto Astro tanto em uma opção da configuração do painel de controle, ou em um arquivo `.nvmrc`.
-
+
### Reservado: `src/content/`
@@ -132,7 +132,6 @@ Astro v2.0 remove essa opção da configuração completamente pois seu comporta
Aplicar plugins remark e rehype em sua configuração de Markdown **não mais desabilita os plugins padrões do Astro**. GitHub-Flavored Markdown e Smartypants agora são aplicados independente de plugins `remarkPlugins` ou `rehypePlugins` customizados serem configurados.
-
##### O que devo fazer?
Remova `extendDefaultPlugins` da sua configuração. Agora este é o comportamento padrão do Astro na v2.0 e você pode deletar essa linha sem nenhuma substituição.
@@ -250,14 +249,12 @@ export default defineConfig({
Revisite a sua configuração Markdown e MDX e compare sua configuração existente com as novas opções disponíveis.
-
### Modificado: Acesso de plugins ao frontmatter
Na v1.x, plugins remark e rehype não haviam acesso ao frontmatter do usuário. Astro juntava o frontmatter de plugins com o frontmatter de seu arquivo, sem passar o frontmatter do arquivo para seus plugins.
Astro v2.0 dá acesso para plugins rehype e remark ao frontmatter do usuário através de injeção de frontmatter. Isso permite autores de plugins modificarem o frontmatter existente de um usuário ou computar novas propriedades com base em outras propriedades.
-
#### O que devo fazer?
Verifique quaisquer plugins remark e rehype que você escreveu para ver se seus comportamentos foram modificados. Note que `data.astro.frontmatter` agora é o frontmatter _completo_ do documento Markdown ou MDX, ao invés de ser um objeto vazio.
@@ -268,7 +265,6 @@ Na v1.x, o pacote de RSS do Astro permitia que você utilizasse `items: import.m
Astro v2.0 introduz a função `pagesGlobToRssItems()` que envolve a propriedade `items`.
-
#### O que devo fazer?
Importe e então envolva sua função existente contendo `import.meta.glob()` com o utilitário `pagesGlobToRssItems()`.
@@ -370,7 +366,6 @@ const todasPostagens = await Astro.glob('./postagens/*.md');
Na v1.0, Astro descontinuou `Astro.canonicalURL` para construir uma URL canônica.
-
Astro v2.0 remove esta opção completamente. `Astro.canonicalURL` no seu código irá causar um erro.
#### O que devo fazer?
@@ -387,13 +382,13 @@ const urlCanonica = new URL(Astro.url.pathname, Astro.site);
### Atualizado: Vite 4
-Astro v2.0 atualiza do Vite 3 para [Vite 4](https://vitejs.dev/), lançado em Dezembro de 2022.
+Astro v2.0 atualiza do Vite 3 para [Vite 4](https://vite.dev/), lançado em Dezembro de 2022.
#### O que devo fazer?
Não deve haver mudanças necessárias no seu código! Nós lidamos com a maioria da atualização para você dentro do Astro; porém, alguns comportamentos sutis do Vite ainda podem mudar entre versões.
-Recorra ao oficial [Guia de Migração do Vite](https://vitejs.dev/guide/migration.html) se você tiver algum problema.
+Recorra ao oficial [Guia de Migração do Vite](https://vite.dev/guide/migration.html) se você tiver algum problema.
## Flags Experimentais do Astro v2.0 Removidas
diff --git a/src/content/docs/pt-br/guides/upgrade-to/v4.mdx b/src/content/docs/pt-br/guides/upgrade-to/v4.mdx
index c9d85909710c3..94fab081e3852 100644
--- a/src/content/docs/pt-br/guides/upgrade-to/v4.mdx
+++ b/src/content/docs/pt-br/guides/upgrade-to/v4.mdx
@@ -88,7 +88,7 @@ Astro v4.0 atualiza do Vite 4 para o Vite 5.
#### O que eu preciso fazer?
-Se você estiver utilizando plugins, configurações, ou APIs específicos do Vite, veja o [guia de migração do Vite](https://pt.vitejs.dev/guide/migration) para saber as mudanças radicais deles e atualize seu projeto conforme necessário. Não há mudanças radicais no próprio Astro.
+Se você estiver utilizando plugins, configurações, ou APIs específicos do Vite, veja o [guia de migração do Vite](https://pt.vite.dev/guide/migration) para saber as mudanças radicais deles e atualize seu projeto conforme necessário. Não há mudanças radicais no próprio Astro.
### Atualizado: dependências de unified, remark, e rehype
@@ -383,4 +383,3 @@ Conhece algum bom recurso para Astro v4.0? [Edite essa página](https://github.c
## Problemas conhecidos
Por favor confira [as issues do Astro no GitHub](https://github.com/withastro/astro/issues/) por problemas reportados, ou para reportar um problema você mesmo.
-
diff --git a/src/content/docs/pt-br/install-and-setup.mdx b/src/content/docs/pt-br/install-and-setup.mdx
index 23d4091601321..fdfa3342af159 100644
--- a/src/content/docs/pt-br/install-and-setup.mdx
+++ b/src/content/docs/pt-br/install-and-setup.mdx
@@ -24,7 +24,7 @@ Você prefere experimentar Astro em seu navegador? Visite [astro.new](https://as
## Compatibilidade de navegador
-Astro é construído com Vite que tem como alvo navegadores com suporte a JavaScript moderno por padrão. Para referência completa, você pode ver a [lista de versões de navegadores atualmente suportados por Vite](https://vitejs.dev/guide/build.html#browser-compatibility).
+Astro é construído com Vite que tem como alvo navegadores com suporte a JavaScript moderno por padrão. Para referência completa, você pode ver a [lista de versões de navegadores atualmente suportados por Vite](https://vite.dev/guide/build.html#browser-compatibility).
## Comece um novo projeto
diff --git a/src/content/docs/pt-br/recipes/captcha.mdx b/src/content/docs/pt-br/recipes/captcha.mdx
index e1c47f8f16eea..b4a0eb5f44690 100644
--- a/src/content/docs/pt-br/recipes/captcha.mdx
+++ b/src/content/docs/pt-br/recipes/captcha.mdx
@@ -4,30 +4,38 @@ description: Aprenda como criar uma rota de API e buscá-la do cliente.
i18nReady: true
type: recipe
---
+import { Steps } from '@astrojs/starlight/components';
[Endpoints do servidor](/pt-br/guides/endpoints/#endpoints-do-servidor-rotas-de-api) podem ser usados como endpoints de API REST para executar funções como autenticações, acesso à banco de dados, e verificações sem expor dados sensíveis ao cliente.
Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem expor o segredo aos clientes.
## Pré-requisitos
+
- Um projeto com [SSR](/pt-br/guides/server-side-rendering/) (`output: 'server'`) habilitado
## Receita
-1. Crie um endpoit `POST` que aceite dados do recaptcha, e então verifique-o com a API do reCAPTCHA. Aqui, você definir valores secretos ou ler variáveis de ambiente com segurança.
+
+1. Crie um endpoint `POST` que aceite dados do recaptcha, e então verifique-o com a API do reCAPTCHA. Aqui, você pode definir valores secretos ou ler variáveis de ambiente com segurança.
+
```js title="src/pages/recaptcha.js"
export async function POST({ request }) {
const dados = await request.json();
const URLrecaptcha = 'https://www.google.com/recaptcha/api/siteverify';
- const corpoRequisicao = {
- secret: "CHAVE_SECRETA_DO_SEU_SITE", // Isso pode ser uma variável de ambiente
- response: dados.recaptcha // O token passado pelo cliente
+ const requestHeaders = {
+ 'Content-Type': 'application/x-www-form-urlencoded'
};
+ const corpoRequisicao = new URLSearchParams({
+ secret: "CHAVE_SECRETA_DO_SEU_SITE", // Isso pode ser uma variável de ambiente
+ response: dados.recaptcha // O token passado pelo cliente
+ });
const resposta = await fetch(URLrecaptcha, {
method: "POST",
- body: JSON.stringify(corpoRequisicao)
+ headers: requestHeaders,
+ body: corpoRequisicao.toString()
});
const dadosResposta = await resposta.json();
@@ -41,7 +49,7 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem
```astro title="src/pages/index.astro"
-
+
@@ -59,7 +67,7 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem
.then((response) => response.json())
.then((gResponse) => {
if (gResponse.success) {
- // Veruficação do captcha foi um sucesso
+ // Verificação do captcha foi um sucesso
} else {
// Verificação do captcha falhou
}
@@ -69,3 +77,4 @@ Nesta receita, uma rota de API é usada para verificar o Google reCAPTCHA v3 sem
```
+
diff --git a/src/content/docs/pt-br/reference/api-reference.mdx b/src/content/docs/pt-br/reference/api-reference.mdx
index d0dbfca7ec621..486988d08f1d8 100644
--- a/src/content/docs/pt-br/reference/api-reference.mdx
+++ b/src/content/docs/pt-br/reference/api-reference.mdx
@@ -33,7 +33,7 @@ const postagens = await Astro.glob('../pages/postagens/*.md'); // retorna um arr
`.glob()` recebe apenas um parâmetro: uma URL relativa dos arquivos locais que você gostaria de importar. Ela é assíncrona e retorna um array das exportações dos arquivos correspondentes.
-`.glob()` não pode receber variáveis ou strings que são interpoladas já que não são estaticamente analisáveis. (Veja [o guia de solução de problemas](/pt-br/guides/troubleshooting/#valores-suportados) para uma solução alternativa.) Isso acontece pois `Astro.glob()` é feito em cima do [`import.meta.glob()`](https://vitejs.dev/guide/features.html#glob-import) do Vite.
+`.glob()` não pode receber variáveis ou strings que são interpoladas já que não são estaticamente analisáveis. (Veja [o guia de solução de problemas](/pt-br/guides/troubleshooting/#valores-suportados) para uma solução alternativa.) Isso acontece pois `Astro.glob()` é feito em cima do [`import.meta.glob()`](https://vite.dev/guide/features.html#glob-import) do Vite.
:::note
Você também pode usar `import.meta.glob()` em si em seu projeto Astro. Você pode querer fazer isso quando:
@@ -42,7 +42,7 @@ Você também pode usar `import.meta.glob()` em si em seu projeto Astro. Você p
- Você quer acessar o caminho de cada arquivo. `import.meta.glob()` retorna um map do caminho do arquivo ao seu conteúdo, enquanto `Astro.glob()` retorna uma lista de conteúdo.
- Você quer passar múltiplos padrões; por exemplo, você quer adicionar um "padrão negativo" que remove certos arquivos filtrados. `import.meta.glob()` pode opcionalmente receber um array de strings blog, ao invés de uma única string.
-Leia mais sobre na [documentação do Vite](https://vitejs.dev/guide/features.html#glob-import).
+Leia mais sobre na [documentação do Vite](https://vite.dev/guide/features.html#glob-import).
:::
#### Arquivos Markdown
@@ -798,7 +798,7 @@ A paginação irá passar a prop `page` para cada página renderizada que repres
## `import.meta`
-Todos os módulos ESM incluem a propriedade `import.meta`. Astro adiciona `import.meta.env` através do [Vite](https://pt.vitejs.dev/guide/env-and-mode).
+Todos os módulos ESM incluem a propriedade `import.meta`. Astro adiciona `import.meta.env` através do [Vite](https://pt.vite.dev/guide/env-and-mode).
**`import.meta.env.SSR`** pode ser utilizado para saber quando se está sendo renderizado no servidor. As vezes você pode querer uma lógica diferente, por exemplo, para um componente que deve ser apenas renderizado no cliente:
@@ -1416,4 +1416,3 @@ Este componente providencia uma forma de inspecionar valores no lado do cliente,
[canonical]: https://en.wikipedia.org/wiki/Canonical_link_element
-
diff --git a/src/content/docs/pt-br/reference/configuration-reference.mdx b/src/content/docs/pt-br/reference/configuration-reference.mdx
index 2eaca51657481..11e9b56e9d360 100644
--- a/src/content/docs/pt-br/reference/configuration-reference.mdx
+++ b/src/content/docs/pt-br/reference/configuration-reference.mdx
@@ -953,7 +953,7 @@ import tailwind from '@astrojs/tailwind';
Passe opções de configuração adicionais ao Vite. Útil quando o Astro não suporta algumas configurações avançadas que você pode precisar.
-Veja a documentação completa do objeto de configuração `vite` em [vitejs.dev](https://vitejs.dev/config/).
+Veja a documentação completa do objeto de configuração `vite` em [vite.dev](https://vite.dev/config/).
#### Exemplos
@@ -1121,4 +1121,3 @@ Habilita um cache persistente para coleções de conteúdo ao fazer o build em m
},
}
```
-
diff --git a/src/content/docs/pt-br/reference/errors/astro-glob-used-outside.mdx b/src/content/docs/pt-br/reference/errors/astro-glob-used-outside.mdx
index 1123afdb59344..b2cf85f65e896 100644
--- a/src/content/docs/pt-br/reference/errors/astro-glob-used-outside.mdx
+++ b/src/content/docs/pt-br/reference/errors/astro-glob-used-outside.mdx
@@ -6,7 +6,7 @@ githubURL: https://github.com/withastro/astro/blob/main/packages/astro/src/core/
> **AstroGlobUsedOutside**: `Astro.glob(GLOB_STR)` só pode ser utilizado em arquivos `.astro`. `import.meta.glob(GLOB_STR)` pode ser usado em seu lugar para alcançar um resultado similar.
## O que deu errado?
-`Astro.glob()` só pode ser utilizado em arquivos `.astro`. Você pode usar [`import.meta.glob()`](https://vitejs.dev/guide/features.html#glob-import) em seu lugar para alcançar o mesmo resultado.
+`Astro.glob()` só pode ser utilizado em arquivos `.astro`. Você pode usar [`import.meta.glob()`](https://vite.dev/guide/features.html#glob-import) em seu lugar para alcançar o mesmo resultado.
**Veja também:**
-- [Astro.glob](/pt-br/reference/api-reference/#astroglob)
\ No newline at end of file
+- [Astro.glob](/pt-br/reference/api-reference/#astroglob)
diff --git a/src/content/docs/pt-br/reference/errors/locals-not-serializable.mdx b/src/content/docs/pt-br/reference/errors/locals-not-serializable.mdx
index 24e1a67ded7eb..8f6370ede4d2d 100644
--- a/src/content/docs/pt-br/reference/errors/locals-not-serializable.mdx
+++ b/src/content/docs/pt-br/reference/errors/locals-not-serializable.mdx
@@ -3,10 +3,15 @@ title: Astro.locals não é serializável
i18nReady: true
githubURL: https://github.com/withastro/astro/blob/main/packages/astro/src/core/errors/errors-data.ts
---
+:::caution[Descontinuado]
+O erro é de uma versão mais velha do Astro e não está mais em uso. Se você estiver incapaz de atualizar seu projeto para uma versão mais recente, você pode então consultar [cópias sem supervisão da documentação antiga](/pt-br/upgrade-astro/#documentação-antiga-sem-manutenção) para assistência.
+:::
+
+
+> **LocalsNotSerializable**: A informação armazenadas em `Astro.locals` para o caminho "`HREF`" não é serializável. Certifique-se de armazenar apenas dados serializáveis. (E03034)
-> **LocalsNotSerializable**: As informações armazenadas em `Astro.locals` para o caminho "`HREF`" não são serializáveis. Certifique-se de armazenar apenas dados serializáveis. (E03034)
## O que deu errado?
-Em modo de desenvolvimento, é lançado erro quando um usuário tenta armazenar algo que não é serializável em `locals`.
+Em modo de desenvolvimento o erro é lançado quando um usuário tenta armazenar algo que não é serializável em `locals`.
Por exemplo:
```ts
@@ -19,4 +24,4 @@ export const onRequest = defineMiddleware((context, next) => {
};
return next();
});
-```
\ No newline at end of file
+```
diff --git a/src/content/docs/pt-br/reference/errors/markdown-content-schema-validation-error.mdx b/src/content/docs/pt-br/reference/errors/markdown-content-schema-validation-error.mdx
index 5dc59ae6c3f48..a924c5e6f9870 100644
--- a/src/content/docs/pt-br/reference/errors/markdown-content-schema-validation-error.mdx
+++ b/src/content/docs/pt-br/reference/errors/markdown-content-schema-validation-error.mdx
@@ -3,6 +3,9 @@ title: Content collection frontmatter invalid.
i18nReady: true
githubURL: https://github.com/withastro/astro/blob/main/packages/astro/src/core/errors/errors-data.ts
---
+:::caution[Descontinuado]
+O erro é de uma versão mais velha do Astro e não está mais em uso. Se você estiver incapaz de atualizar seu projeto para uma versão mais recente, você pode então consultar [cópias sem supervisão da documentação antiga](/pt-br/upgrade-astro/#documentação-antiga-sem-manutenção) para assistência.
+:::
> **Mensagens de erro de exemplo:**
Não foi possível fazer parse do frontmatter em **blog** → **postagem.md**
@@ -10,7 +13,6 @@ Não foi possível fazer parse do frontmatter em **blog** → **postagem.md** **NoPrerenderedRoutesWithDomains**: Páginas estáticas ainda não são suportadas com múltiplos domínios. Se você deseja habilitar esse recurso, você precisa desabilitar a pré-renderização para a página COMPONENT
+
## O que deu errado?
-Páginas estáticas ainda não são suportadas com domínios `i18n`. Se você deseja habilitar esse recurso, você precisa desabilitar a pré-renderização.
+Páginas estáticas ainda não são suportadas com domínios i18n. Se você deseja habilitar esse recurso, você precisa desabilitar a pré-renderização.
+
+
+
diff --git a/src/content/docs/pt-br/reference/errors/unknown-vite-error.mdx b/src/content/docs/pt-br/reference/errors/unknown-vite-error.mdx
index 7c93c09012ffc..958dc2bbec480 100644
--- a/src/content/docs/pt-br/reference/errors/unknown-vite-error.mdx
+++ b/src/content/docs/pt-br/reference/errors/unknown-vite-error.mdx
@@ -11,6 +11,4 @@ Vite encontrou um erro desconhecido enquanto renderizava seu projeto. Nós infel
Se você pode confiavelmente fazer com que esse erro aconteça, nós apreciaríamos se você pudesse [abrir uma issue](https://astro.build/issues/).
**Veja Também:**
-- [Guia de solução de problemas do Vite](https://vitejs.dev/guide/troubleshooting.html)
-
-
+- [Guia de solução de problemas do Vite](https://vite.dev/guide/troubleshooting.html)
diff --git a/src/content/docs/pt-br/reference/integrations-reference.mdx b/src/content/docs/pt-br/reference/integrations-reference.mdx
index a807a89f206e7..d8dbe86455526 100644
--- a/src/content/docs/pt-br/reference/integrations-reference.mdx
+++ b/src/content/docs/pt-br/reference/integrations-reference.mdx
@@ -64,9 +64,9 @@ interface AstroIntegration {
**Próximo hook:** [`astro:config:done`](#astroconfigdone)
-**Quando:** Durante a inicialização, antes da configuração do [Vite](https://vitejs.dev/config/) ou [Astro](/pt-br/reference/configuration-reference/) ser resolvida.
+**Quando:** Durante a inicialização, antes da configuração do [Vite](https://vite.dev/config/) ou [Astro](/pt-br/reference/configuration-reference/) ser resolvida.
-**Por que:** Para estender a configuração do projeto. Isso inclui atualizar a [configuração do Astro](/pt-br/reference/configuration-reference/), aplicar [plugins Vite](https://vitejs.dev/guide/api-plugin.html), adicionar renderizadores de componentes, e injetar scripts na página.
+**Por que:** Para estender a configuração do projeto. Isso inclui atualizar a [configuração do Astro](/pt-br/reference/configuration-reference/), aplicar [plugins Vite](https://vite.dev/guide/api-plugin.html), adicionar renderizadores de componentes, e injetar scripts na página.
```ts
'astro:config:setup'?: (options: {
@@ -111,7 +111,7 @@ Uma cópia de somente leitura da [configuração Astro](/pt-br/reference/configu
Uma função de callback para atualizar a [configuração Astro](/pt-br/reference/configuration-reference/) suprida pelo usuário. Qualquer configuração que você providenciar **será mesclada com a configuração do usuário + atualizações da configuração de outras integrações**, então você está livre para omitir as chaves!
-Por exemplo, digamos que você precisa fornecer um plugin [Vite](https://vitejs.dev/) ao projeto do usuário:
+Por exemplo, digamos que você precisa fornecer um plugin [Vite](https://vite.dev/) ao projeto do usuário:
```js
import bananaCSS from '@vitejs/official-banana-css-plugin';
@@ -356,7 +356,7 @@ Ao publicar seu pacote (`@chique/painel`, neste caso) no npm, você deve exporta
Uma função de callback para injetar uma string de conteúdo JavaScript em todas as páginas.
-O **`stage`** indica como este script (o `content`) deve ser inserido. Alguns stages permitem inserir scripts sem modificação, enquanto outros permitem otimizações durante [a etapa de bundling do Vite](https://vitejs.dev/guide/build.html):
+O **`stage`** indica como este script (o `content`) deve ser inserido. Alguns stages permitem inserir scripts sem modificação, enquanto outros permitem otimizações durante [a etapa de bundling do Vite](https://vite.dev/guide/build.html):
- `"head-inline"`: Injetado em uma tag script no `` de cada página. **Não é** otimizado ou resolvido pelo Vite.
- `"before-hydration"`: Importado no lado do cliente, antes do script de hidratação ser executado. Otimizado e resolvido pelo Vite.
@@ -394,7 +394,7 @@ Uma cópia de somente leitura da [configuração Astro](/pt-br/reference/configu
**Próximo hook:** [`astro:server:start`](#astroserverstart)
-**Quando:** Logo após o servidor do Vite ser criado no modo "dev", porém antes do evento `listen()` ser disparado. [Veja a API createServer do Vite](https://vitejs.dev/guide/api-javascript.html#createserver) para saber mais.
+**Quando:** Logo após o servidor do Vite ser criado no modo "dev", porém antes do evento `listen()` ser disparado. [Veja a API createServer do Vite](https://vite.dev/guide/api-javascript.html#createserver) para saber mais.
**Por que:** Para atualizar as configurações do servidor Vite e middleware.
@@ -404,7 +404,7 @@ Uma cópia de somente leitura da [configuração Astro](/pt-br/reference/configu
#### Opção `server`
-**Tipo:** [`ViteDevServer`](https://vitejs.dev/guide/api-javascript.html#vitedevserver)
+**Tipo:** [`ViteDevServer`](https://vite.dev/guide/api-javascript.html#vitedevserver)
Uma instância mutável do servidor Vite usado no modo "dev". Por exemplo, esta é [utilizada pela nossa integração Partytown](/pt-br/guides/integrations-guide/partytown/) para injetar o servidor Partytown como um middleware:
@@ -524,7 +524,7 @@ O endereço, família e número de porta suprido pelo [módulo Net do NodeJS](ht
**Quando:** Após a build para produção (SSG ou SSR) tiver sido completada.
-**Por que:** Para acessar rotas geradas e assets para extensão (ex. copiar conteúdo do diretório gerado `/assets`). Se você planeja transformar assets gerados, nós recomendados explorar a [API de Plugins Vite](https://vitejs.dev/guide/api-plugin.html) e [configurá-la via `astro:config:setup`](#opção-updateconfig) no lugar.
+**Por que:** Para acessar rotas geradas e assets para extensão (ex. copiar conteúdo do diretório gerado `/assets`). Se você planeja transformar assets gerados, nós recomendados explorar a [API de Plugins Vite](https://vite.dev/guide/api-plugin.html) e [configurá-la via `astro:config:setup`](#opção-updateconfig) no lugar.
```js
'astro:build:done'?: (options: { dir: URL; routes: RouteData[], pages: { pathname: string }[] }) => void | Promise;
diff --git a/src/content/docs/pt-br/tutorial/0-introduction/1.mdx b/src/content/docs/pt-br/tutorial/0-introduction/1.mdx
index ddea1a38a764c..9c4a9ba7e97c2 100644
--- a/src/content/docs/pt-br/tutorial/0-introduction/1.mdx
+++ b/src/content/docs/pt-br/tutorial/0-introduction/1.mdx
@@ -4,35 +4,33 @@ title: Sobre este Tutorial
description: Como começar o tutorial "Construa seu primeiro blog Astro".
i18nReady: true
---
-
import Checklist from '~/components/Checklist.astro';
import Box from '~/components/tutorial/Box.astro';
-
## O que eu preciso saber para começar?
-Se você tem alguma familiaridade básica com **HTML**, **Markdown**, **CSS** e um pouco de **JavaScript**, estão você está pronto! Você será capaz de completar este tutorial inteiro apenas seguindo as instruções. Astro é para todo mundo! 🧑🚀 👩🚀 👨🚀
+Se você tem alguma familiaridade básica com **HTML**, **Markdown**, **CSS** e um pouco de **JavaScript**, então você já está pronto! Você será capaz de completar este tutorial inteiro apenas seguindo as instruções. Astro é para todos! 🧑🚀 👩🚀 👨🚀
-Você também irá precisar de uma conta do [GitHub](https://github.com) (ou similar) para publicar o seu projeto na web.
+Você também precisará de uma conta [GitHub](https://github.com) (ou similar) para publicar o seu projeto na web.
Como eu uso as checklists no final de cada página?
-Você as checa!
+Você verifica elas!
-No final de cada página, você irá encontrar uma checklist clicável de tarefas que agora você deve ser capaz de fazer. Cheque esses itens para ver seu progresso no "Progresso do Tutorial".
+No final de cada página, você encontrará uma checklist, uma lista de verificação clicável de tarefas que agora você deve ser capaz de fazer. Marque esses itens para ver seu progresso no Acompanhamento do Tutorial.
-Utilizá-lo é opcional, mas pode te ajudar a lembrar sua posição se você completar o tutorial durante múltiplas visitas. Você também pode deixar alguns itens da checklist em branco como um lembrete de unidades que você quer revisitar posteriormente.
+Utilizar o acompanhamento é opcional, mas ele pode te ajudar a lembrar onde você estava se você completar o tutorial durante múltiplas visitas. Você também pode deixar alguns itens da lista de verificação em branco como um lembrete de unidades que você queira revisitar posteriormente.
-(Esses dados só são salvos no armazenamento local do seu navegador e não está disponível em nenhum outro lugar. Nenhum dado é enviado, ou armazenado, pelo Astro.)
+(Esses dados são salvos apenas no armazenamento local do seu navegador e não estão disponíveis em nenhum outro lugar. Nenhum dado é enviado ou armazenado pelo Astro.)
-A Unidade 1 tem as coisas que eu já sei fazer. Posso pulá-la?
+A Unidade 1 mostra coisas que eu já sei fazer. Posso pulá-la?
-Você pode usar as lições dentro da [Unidade 1](/pt-br/tutorial/1-setup/) para certificar-se de que você tem as ferramentas de desenvolvimento e contas online que você vai precisar para completar o tutorial. Elas irão te guiar através da criação de um novo projeto Astro, o armazenando no GitHub, e fazendo deploy para a Netlify.
+Você pode usar as lições dentro da [Unidade 1](/pt-br/tutorial/1-setup/) para certificar-se de que tem as ferramentas de desenvolvimento e contas online que você precisará para completar o tutorial. Elas te guiarão pelas etapas de criação de um novo projeto Astro, armazenamento no GitHub, e publicação com a Netlify.
-Se você [criar um novo projeto Astro vazio](/pt-br/install-and-setup/) e está confortável com sua configuração, você pode pular de forma segura para a [Unidade 2](/pt-br/tutorial/2-pages/) onde você irá começar a fazer novas páginas em seu projeto.
+Se você [criar um novo projeto Astro vazio](/pt-br/install-and-setup/) e estiver confortável com sua configuração, você pode seguramente pular para a [Unidade 2](/pt-br/tutorial/2-pages/) onde você começará a fazer novas páginas em seu projeto.
@@ -43,10 +41,16 @@ Nosso [amigável servidor do Astro no Discord](https://astro.build/chat) é o lu
Dê um pulo no fórum de suporte para fazer perguntas, ou mande um oi e converse no `#general` ou `#off-topic`.
+
+O que posso fazer depois de completar este tutorial?
+
+Ao fim deste tutorial, você terá um blog funcional usando o roteamento baseado em arquivos embutido no Astro. Você pode melhorar o código final desse projeto [refatorando-o para gerenciar seu conteúdo com coleções de conteúdo](/pt-br/tutorials/add-content-collections/) ou [adicionando transições de visualização para personalizar a navegação entre páginas](/pt-br/tutorials/add-view-transitions/).
+
+
Onde posso opinar sobre este tutorial?
-Este tutorial é um projeto da nossa equipe de documentação. Você pode nos encontrar no Discord no canal `#docs`, ou criar issues no [repositório Docs no GitHub](https://github.com/withastro/docs/issues).
+Este tutorial é um projeto da nossa equipe de documentação. Você pode nos encontrar no Discord no canal `#docs`, ou criar _issues_ no [repositório Docs no GitHub](https://github.com/withastro/docs/issues).
diff --git a/src/content/docs/pt-br/tutorial/1-setup/1.mdx b/src/content/docs/pt-br/tutorial/1-setup/1.mdx
index cdd93e96c0885..9162686e1626c 100644
--- a/src/content/docs/pt-br/tutorial/1-setup/1.mdx
+++ b/src/content/docs/pt-br/tutorial/1-setup/1.mdx
@@ -11,6 +11,7 @@ import Box from '~/components/tutorial/Box.astro';
import MultipleChoice from '~/components/tutorial/MultipleChoice.astro';
import Option from '~/components/tutorial/Option.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
+import { Steps } from '@astrojs/starlight/components';
import Badge from "~/components/Badge.astro"
@@ -35,12 +36,12 @@ Para verificar se você já tem uma versão compatível instalada, execute o seg
node -v
// Resultado de exemplo
-v18.14.1
+v18.17.1
```
-Se o comando retorna um número de versão maior que `v18.14.1`, você está pronto para continuar!
+Se o comando retornar um número de versão maior que `v18.17.1` ou `v20.3.0` (excluindo qualquer `v19`), você pode continuar!
-Se o comando retorna uma mensagem de erro como `Command 'node' not found`, ou um número de versão inferior a `v18.14.1`, então você precisa [instalar uma versão compatível do Node.js](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm).
+Se o comando retornar uma mensagem de erro como `Command 'node' not found`, ou um número de versão menor do que o exigido, então você precisa [instalar uma versão compatível do Node.js](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm).
### Editor de Código
@@ -50,9 +51,9 @@ Adicionalmente, você irá precisar baixar e instalar um **editor de código** p
Este tutorial irá utilizar **VS Code**, porém você pode usar qualquer outro editor para seu sistema operacional.
:::
-1. [Baixe e instale o VS Code](https://code.visualstudio.com/#alt-downloads) ou outro editor de código de sua escolha.
-
-
+
+1. [Baixe e instale o VS Code](https://code.visualstudio.com/#alt-downloads) ou outro editor de código de sua escolha.
+
diff --git a/src/content/docs/pt-br/tutorial/1-setup/3.mdx b/src/content/docs/pt-br/tutorial/1-setup/3.mdx
index 6233d0108e4de..8618d63b48fdc 100644
--- a/src/content/docs/pt-br/tutorial/1-setup/3.mdx
+++ b/src/content/docs/pt-br/tutorial/1-setup/3.mdx
@@ -6,14 +6,12 @@ description: |-
Faça suas primeiras mudanças a página inicial do projeto do tutorial
i18nReady: true
---
-
import Checklist from '~/components/Checklist.astro';
import Box from '~/components/tutorial/Box.astro';
import InstallGuideTabGroup from '~/components/TabGroup/InstallGuideTabGroup.astro';
import PackageManagerTabs from '~/components/tabs/PackageManagerTabs.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
-
-
+import { Steps } from '@astrojs/starlight/components';
- Fazer sua primeira mudança ao seu novo website
@@ -21,6 +19,8 @@ import PreCheck from '~/components/tutorial/PreCheck.astro';
## Edite sua página inicial
+
+
1. No seu editor de código, navegue no painel Explorador de arquivos para `src/pages/index.astro` e clique nele para abrir os conteúdos do arquivo em uma aba editável.
Os conteúdos do seu arquivo `index.astro` devem se parecer com isso:
@@ -55,6 +55,7 @@ import PreCheck from '~/components/tutorial/PreCheck.astro';
```
3. Verifique a pré-visualização do navegador, você deve ver o conteúdo da sua página atualizado para o texto novo.
+
Parabéns! Você agora é um desenvolvedor Astro!
diff --git a/src/content/docs/pt-br/tutorial/1-setup/4.mdx b/src/content/docs/pt-br/tutorial/1-setup/4.mdx
index 94e052dea3122..7f174ac9abcf7 100644
--- a/src/content/docs/pt-br/tutorial/1-setup/4.mdx
+++ b/src/content/docs/pt-br/tutorial/1-setup/4.mdx
@@ -9,6 +9,7 @@ i18nReady: true
import Checklist from '~/components/Checklist.astro';
import Box from '~/components/tutorial/Box.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
+import { Steps } from '@astrojs/starlight/components';
import Badge from "~/components/Badge.astro"
@@ -25,6 +26,7 @@ Se você já é familiar com git e tem seu próprio fluxo de trabalho, então cr
Apesar de terem algumas formas de conseguir armazenar o seu código local no GitHub, este tutorial irá te guiar através de um método que não precisa utilizar git na linha de comando.
+
1. Entre no GitHub.com em um navegador e clique no + no lado superior direito da tela para criar um novo repositório.
2. Escolha um nome para seu repositório. Não é necessário ser o mesmo nome que a pasta do seu projeto.
@@ -32,13 +34,13 @@ Apesar de terem algumas formas de conseguir armazenar o seu código local no Git
3. Você será apresentado opções, mas você não precisa mudar nenhuma das opções padrões. Role para baixo e clique no botão Create Repository.
4. Você será apresentado com vários próximos passos de configuração, mas você não precisará utilizar nenhum deles. Anote a URL do seu repositório. Você agora pode sair desta página sem fazer nada.
-
+
## Faça commit do seu código local para o GitHub
Na última seção, você fez uma mudança no conteúdo de uma página. Isso significa que os arquivos do seu projeto mudaram, e o VS Code deve mostrar um número acima do ícone do menu "Controle do Código-Fonte". Esta aba de código-fonte é onde você vai regularmente ir para atualizar seus arquivos no GitHub.
-
+
1. Clique na aba de Controle do Código no seu VS Code para ver uma lista de arquivos que foram modificados. Se você ver uma mensagem de que você precisa instalar `git`, siga as instruções fornecidas, e então recarregue o VS Code.
2. Clique no menu ••• "3 pontos" acima da mensagem de commit e escolha Remoto > Adicionar Remoto.
@@ -52,7 +54,7 @@ Na última seção, você fez uma mudança no conteúdo de uma página. Isso sig
6. Você pode ver uma mensagem te dizendo que você não tem commits "preparados", e perguntando se você gostaria de prepará-los. Clique Sempre e continue.
7. Finalmente, a lista de arquivos modificados deve ser substituída com um botão de Publicar. Clique-o para enviar suas mudanças confirmadas ao GitHub.
-
+
### Veja seu projeto no GitHub
diff --git a/src/content/docs/pt-br/tutorial/1-setup/5.mdx b/src/content/docs/pt-br/tutorial/1-setup/5.mdx
index b435b505aea07..2e57793270cf2 100644
--- a/src/content/docs/pt-br/tutorial/1-setup/5.mdx
+++ b/src/content/docs/pt-br/tutorial/1-setup/5.mdx
@@ -11,6 +11,7 @@ import Box from '~/components/tutorial/Box.astro';
import MultipleChoice from '~/components/tutorial/MultipleChoice.astro';
import Option from '~/components/tutorial/Option.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
+import { Steps } from '@astrojs/starlight/components';
import Badge from "~/components/Badge.astro"
@@ -26,6 +27,7 @@ Este tutorial irá utilizar **Netlify**, porém você está livre para utilizar
## Crie um novo site Netlify
+
1. Crie uma conta gratuita em [Netlify](https://netlify.com) se você já não a tiver.
Anote o seu nome de usuário. Você irá ver seu painel de controle e quaisquer sites que criou em `https://app.netlify.com/teams/nome`
@@ -35,6 +37,7 @@ Este tutorial irá utilizar **Netlify**, porém você está livre para utilizar
Você será questionado a conectar com um provedor Git. Escolha o GitHub e siga os passos na tela para autenticar sua conta do GitHub. Então, escolha o repositório do GitHub do seu projeto Astro pela lista fornecida.
3. Na última etapa, Netlify irá te mostrar as opções do site do seu aplicativo. As opções padrões devem estar corretas para seu projeto Astro, então você pode rolar para baixo e clicar em Deploy site.
+
Parabéns, você tem um site Astro!
diff --git a/src/content/docs/pt-br/tutorial/1-setup/index.mdx b/src/content/docs/pt-br/tutorial/1-setup/index.mdx
index 09ba5cc897837..141964bbeda00 100644
--- a/src/content/docs/pt-br/tutorial/1-setup/index.mdx
+++ b/src/content/docs/pt-br/tutorial/1-setup/index.mdx
@@ -4,13 +4,14 @@ unitTitle: Crie e faça deploy do seu primeiro site Astro
title: 'Check in: Unidade 1 - Configuração'
description: >-
Tutorial: Construa seu primeiro blog Astro —
- Prepare seu ambiente de desenvolvimento, crie e faça deploy do seu primeiro site Astro
+
+ Prepare seu ambiente de desenvolvimento, crie e faça deploy
+ do seu primeiro site Astro
i18nReady: true
---
-
import Checklist from '~/components/Checklist.astro';
import Box from '~/components/tutorial/Box.astro';
-
+import { Steps } from '@astrojs/starlight/components';
Agora que você sabe o que estará construindo, é hora de configurar todas as ferramentas que você vai precisar!
@@ -23,6 +24,8 @@ Quer completar este tutorial em um editor de código online ao invés disso?
Siga estas instruções, então vá diretamente para a Unidade 2!
**Configure o StackBlitz**
+
+
1. Visite [astro.new](https://astro.new) e clique no botão para abrir o template "Empty Project" no StackBlitz.
2. Clique em "Sign in" no lado superior direito para entrar com suas credenciais do GitHub.
@@ -30,6 +33,7 @@ Quer completar este tutorial em um editor de código online ao invés disso?
3. No lado superior esquerdo da janela do editor do StackBlitz, clique em "fork" no template (salvar no painel da sua própria conta).
4. Espere o projeto carregar, e então você irá ver uma visualização ao vivo do template inicial "Empty Project".
+
**Faça uma Modificação**
@@ -37,9 +41,11 @@ No painel de arquivos, você deve ver `src/pages/index.astro`. Clique para abrí
**Crie um Repositório no GitHub**
+
1. Clique no botão Connect Repository no topo da sua lista de arquivos, insira um novo nome para seu repositório, e clique em Create repo & push.
2. Quando você tiver chances para dar commit no GitHub, um botão "Commit" irá aparecer no lado superior esquerdo da sua área de trabalho. Clicar nele irá te permitir inserir uma mensagem de commit, e então atualizar seu repositório.
+
**Faça Deploy do seu Site**
@@ -58,6 +64,7 @@ Enquanto você escreve código, você irá periodicamente fazer commit de suas m
Toda vez que você fazer commit de uma mudança para o GitHub, uma notificação será enviada a Netlify. Então, a Netlify irá automaticamente refazer a build e republicar seu site ao vivo para refletir a essas mudanças.
+
## Checklist
diff --git a/src/content/docs/pt-br/tutorial/4-layouts/1.mdx b/src/content/docs/pt-br/tutorial/4-layouts/1.mdx
index ca91fb850e440..c109d9ccb9600 100644
--- a/src/content/docs/pt-br/tutorial/4-layouts/1.mdx
+++ b/src/content/docs/pt-br/tutorial/4-layouts/1.mdx
@@ -11,7 +11,7 @@ import Checklist from '~/components/Checklist.astro';
import MultipleChoice from '~/components/tutorial/MultipleChoice.astro';
import Option from '~/components/tutorial/Option.astro';
import PreCheck from '~/components/tutorial/PreCheck.astro';
-
+import { Steps } from '@astrojs/starlight/components';
@@ -24,7 +24,8 @@ Você ainda tem alguns componentes Astro repetidamente renderizados em cada pág
## Crie seu primeiro componente de layout
-1. Crie um novo arquivo em `src/layouts/BaseLayout.astro`. (Você irá preciasr criar uma nova pasta `layouts` primeiro.)
+
+1. Crie um novo arquivo em `src/layouts/BaseLayout.astro`. (Você precisará criar uma nova pasta `layouts` primeiro.)
2. Copie **todo o conteúdo** de `index.astro` para seu novo arquivo, `BaseLayout.astro`.
@@ -53,9 +54,11 @@ Você ainda tem alguns componentes Astro repetidamente renderizados em cada pág
```
+
## Utilize seu layout em uma página
+
3. Substitua o código em `src/pages/index.astro` com o seguinte:
```astro title="src/pages/index.astro"
@@ -68,9 +71,9 @@ Você ainda tem alguns componentes Astro repetidamente renderizados em cada pág
```
-4. Verifique a pré-visualização do navegador novamente para notar o que (ou, alerta de spoiler: _não_) mudou.
+4. Verifique a pré-visualização do navegador novamente para observar o que (ou, alerta de spoiler: _não_!) mudou.
-5. Adicione um elemento `` ao `src/layouts/BaseLayout.astro` acima do componente de Rodapé, e então verifique a pré-visualização do navegador de sua página Início e note o que realmente _de fato_ mudou desta vez!
+5. Adicione um elemento `` ao `src/layouts/BaseLayout.astro` acima do componente de rodapé, e então verifique a pré-visualização do navegador de sua página de Início e observe o que de fato _realmente_ mudou desta vez!
```astro title="src/layouts/BaseLayout.astro" ins={18}
---
@@ -98,12 +101,14 @@ Você ainda tem alguns componentes Astro repetidamente renderizados em cada pág
```
+
- O `` te permite injetar (ou "encaixar") **conteúdo filho** escrito entre as tags de abertura e fechamento `` em qualquer arquivo `Componente.astro`.
+ O `` permite que você injete (ou "encaixe") **conteúdo filho** escrito entre as tags de abertura e fechamento `` em qualquer arquivo `Componente.astro`.
## Passe valores específicos da página como props
-1. Passe o título da página para seu componente de layout de `index.astro` utilizando um atributo do componente:
+
+6. Passe o título da página para seu componente de layout de `index.astro` utilizando um atributo do componente:
```astro title="src/pages/index.astro" 'pageTitle={pageTitle}'
---
@@ -115,7 +120,7 @@ Você ainda tem alguns componentes Astro repetidamente renderizados em cada pág
```
-2. Modifique o script do seu componente de layout `BaseLayout.astro` para receber um título da página através de `Astro.props` ao invés de definí-lo como uma constante.
+7. Modifique o script do seu componente de layout `BaseLayout.astro` para receber um título da página através de `Astro.props` em vez de definí-lo como uma constante.
```astro title="src/layouts/BaseLayout.astro" del={5} ins={6}
---
@@ -127,26 +132,28 @@ Você ainda tem alguns componentes Astro repetidamente renderizados em cada pág
---
```
-3. Verifique a pré-visualização da sua página para verificar que o título da sua página não mudou. Ele tem o mesmo valor, mas agora está sendo renderizado dinamicamente. E agora, cada página individual pode especificar seu próprio título para o layout.
-
+8. Confira a pré-visualização no navegador para verificar que o título da página não mudou. Ele tem o mesmo valor, mas agora está sendo apresentado dinamicamente. E agora, cada página individual poderá especificar seu próprio título para o layout.
+
## Tente você mesmo - Utilize seu layout em todo lugar
-**Refatore** suas outras páginas (`blog.astro` e `about.astro`) para que elas utilizem seu novo componente `` para renderizar elementos comuns da página.
+**Refatore** suas outras páginas (`blog.astro` e `about.astro`) para que elas utilizem seu novo componente `` para mostrar elementos comuns da página. (Nota: usar o BaseLayout para mostrar sua página `about.astro` significa que você perderá a tag `
```
-完整的细节见 [Vite 的文档](https://cn.vitejs.dev/guide/assets.html#importing-asset-as-string)。
+完整的细节见 [Vite 的文档](https://cn.vite.dev/guide/assets.html#importing-asset-as-string)。
### 导入 `?url` CSS
@@ -617,7 +617,7 @@ import rawStylesCSS from '../styles/main.css?raw';
对于大多数用户来说，不建议这样做。相反，将 CSS 文件放在 `public/` 内，你可以获得一致的链接。
:::caution
-用 `?url` 导入较小的 CSS 文件，可能会在最终构建时将 CSS 文件的 base64 编码内容作为数据链接返回值。你可以编写代码以支持经编码的数据链接（`data:text/css;base64,...`），或者将 [`vite.build.assetsInlineLimit`](https://cn.vitejs.dev/config/#build-assetsinlinelimit) 配置选项设为 `0` 以禁用这一功能。
+用 `?url` 导入较小的 CSS 文件，可能会在最终构建时将 CSS 文件的 base64 编码内容作为数据链接返回值。你可以编写代码以支持经编码的数据链接（`data:text/css;base64,...`），或者将 [`vite.build.assetsInlineLimit`](https://cn.vite.dev/config/#build-assetsinlinelimit) 配置选项设为 `0` 以禁用这一功能。
:::
```astro title="src/components/RawStylesUrl.astro" "?url"
@@ -629,7 +629,7 @@ import stylesUrl from '../styles/main.css?url';
```
-完整的细节见 [Vite 文档](https://vitejs.dev/guide/assets.html#importing-asset-as-url)。
+完整的细节见 [Vite 文档](https://vite.dev/guide/assets.html#importing-asset-as-url)。
[less]: https://lesscss.org/
@@ -637,6 +637,6 @@ import stylesUrl from '../styles/main.css?url';
[stylus]: https://stylus-lang.com/
[svelte-style]: https://svelte.dev/docs#component-format-style
[tailwind]: /zh-cn/guides/integrations-guide/tailwind/
-[vite-preprocessors]: https://cn.vitejs.dev/guide/features.html#css-pre-processors
+[vite-preprocessors]: https://cn.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
diff --git a/src/content/docs/zh-cn/guides/troubleshooting.mdx b/src/content/docs/zh-cn/guides/troubleshooting.mdx
index 87c10a3fa3b6f..8bc51063a07ae 100644
--- a/src/content/docs/zh-cn/guides/troubleshooting.mdx
+++ b/src/content/docs/zh-cn/guides/troubleshooting.mdx
@@ -33,7 +33,7 @@ Astro frontmatter 中的 `console.log()` 语句将始终输出到运行 Astro CL
### Astro `` 组件
-为了帮助你调试 Astro 组件，Astro 提供了内置的 [``](/zh-cn/reference/api-reference/#debug-) 组件，你可以用它把任意值直接渲染到你的 HTML 模板中。这对于在浏览器中进行快速调试是很有用的，而不必在终端和浏览器之间来回切换。
+为了帮助你调试 Astro 组件，Astro 提供了内置的 [``](/zh-cn/reference/components-reference/#debug-) 组件，你可以用它把任意值直接渲染到你的 HTML 模板中。这对于在浏览器中进行快速调试是很有用的，而不必在终端和浏览器之间来回切换。
```astro {2,7}
---
@@ -159,7 +159,7 @@ npm install @astrojs/react react react-dom
`Astro.glob()` 不支持动态变量和字符串插值。
-这不是 Astro 的 bug。这是由于 [Vite 的 `import.meta.glob()` 函数](https://cn.vitejs.dev/guide/features.html#glob-import)的限制，它只支持静态字符串字面量。
+这不是 Astro 的 bug。这是由于 [Vite 的 `import.meta.glob()` 函数](https://cn.vite.dev/guide/features.html#glob-import)的限制，它只支持静态字符串字面量。
通常可以使用 `Astro.glob()` 导入包括所有你需要的文件集，然后对其进行过滤，以此来解决这个问题。
diff --git a/src/content/docs/zh-cn/guides/typescript.mdx b/src/content/docs/zh-cn/guides/typescript.mdx
index b49e939094060..cfbf79f464d03 100644
--- a/src/content/docs/zh-cn/guides/typescript.mdx
+++ b/src/content/docs/zh-cn/guides/typescript.mdx
@@ -29,7 +29,7 @@ Astro 中包含三个可扩展的 `tsconfig.json` 模板：`base`、`strict` 和
}
```
-此外，我们的模板在 `src` 文件夹中包含一个名为 `env.d.ts` 的文件，它为你的项目提供 [Vite 的客户端类型](https://cn.vitejs.dev/guide/features.html#client-types)：
+此外，我们的模板在 `src` 文件夹中包含一个名为 `env.d.ts` 的文件，它为你的项目提供 [Vite 的客户端类型](https://cn.vite.dev/guide/features.html#client-types)：
```typescript title="env.d.ts"
///
diff --git a/src/content/docs/zh-cn/guides/upgrade-to/v2.mdx b/src/content/docs/zh-cn/guides/upgrade-to/v2.mdx
index 2722c6f3f8e5e..aae13049d3023 100644
--- a/src/content/docs/zh-cn/guides/upgrade-to/v2.mdx
+++ b/src/content/docs/zh-cn/guides/upgrade-to/v2.mdx
@@ -382,13 +382,13 @@ const canonicalURL = new URL(Astro.url.pathname, Astro.site);
### 更新：Vite 4
-Astro v2.0 从 Vite 3 升级到 [Vite 4](https://vitejs.dev/)，该版本于 2022 年 12 月发布。
+Astro v2.0 从 Vite 3 升级到 [Vite 4](https://vite.dev/)，该版本于 2022 年 12 月发布。
#### 我应该怎么做？
在你的代码中应该不需要做任何更改！我们已经在 Astro 内部处理了大部分的升级工作；然而，一些微妙的 Vite 行为在不同版本之间可能仍然有所变化。
-如果遇到问题，请参考官方的 [Vite 迁移指南](https://vitejs.dev/guide/migration.html)。
+如果遇到问题，请参考官方的 [Vite 迁移指南](https://vite.dev/guide/migration.html)。
## Astro v2.0 实验性标志已移除
diff --git a/src/content/docs/zh-cn/guides/upgrade-to/v4.mdx b/src/content/docs/zh-cn/guides/upgrade-to/v4.mdx
index 359908926b9de..36f85dde83fdd 100644
--- a/src/content/docs/zh-cn/guides/upgrade-to/v4.mdx
+++ b/src/content/docs/zh-cn/guides/upgrade-to/v4.mdx
@@ -90,7 +90,7 @@ Astro v4.0 从 Vite 4 升级到了 Vite 5。
#### 我应该做什么？
-如果你使用了 Vite 的插件、配置或 API，请查看 [Vite 迁移指南](https://vitejs.dev/guide/migration)中的破坏性更改并根据需要升级你的项目。Astro 本身没有任何破坏性更改。
+如果你使用了 Vite 的插件、配置或 API，请查看 [Vite 迁移指南](https://vite.dev/guide/migration)中的破坏性更改并根据需要升级你的项目。Astro 本身没有任何破坏性更改。
### 已升级：unified、remark、和 rehype 依赖
diff --git a/src/content/docs/zh-cn/install-and-setup.mdx b/src/content/docs/zh-cn/install-and-setup.mdx
index 78f60b25d4dd1..355024f9703b9 100644
--- a/src/content/docs/zh-cn/install-and-setup.mdx
+++ b/src/content/docs/zh-cn/install-and-setup.mdx
@@ -24,7 +24,7 @@ import ReadMore from '~/components/ReadMore.astro';
## 浏览器兼容性
-Astro 使用 Vite 构建，Vite 默认针对支持现代 JavaScript 的浏览器。要阅读完整的参考，你可以 [在 Vite 中查看当前支持的浏览器版本列表](https://cn.vitejs.dev/guide/build#browser-compatibility)。
+Astro 使用 Vite 构建，Vite 默认针对支持现代 JavaScript 的浏览器。要阅读完整的参考，你可以 [在 Vite 中查看当前支持的浏览器版本列表](https://cn.vite.dev/guide/build#browser-compatibility)。
## 开始一个新项目
@@ -58,7 +58,7 @@ Astro 使用 Vite 构建，Vite 默认针对支持现代 JavaScript 的浏览器
如果一切顺利，你将看到一个成功信息，随后是一些推荐的后续步骤。现在你的项目已经创建好了，你可以 `cd` 进入你的新项目目录开始使用 Astro。
-2. 如果你在 CLI 向导中跳过了 `npm install` 步骤，那么在继续之前请确保安装你的依赖。
+2. 如果你在 CLI 向导中跳过了 "Install dependencies?"（安装依赖？） 步骤，那么在继续之前请确保安装你的依赖。
3. 现在你可以 [启动 Astro 开发服务器](#启动-astro-开发服务器) 并在构建时看到你的项目的实时预览！
@@ -414,4 +414,3 @@ Astro 将在一个单独的文件夹（默认为 `dist/`）中构建你的网站
8. 现在你可以[启动 Astro 开发服务器](#启动-astro-开发服务器) 并在构建项目的同时查看实时预览了！
-
diff --git a/src/content/docs/zh-cn/reference/api-reference.mdx b/src/content/docs/zh-cn/reference/api-reference.mdx
index 9a9ce49a9de1d..18b40adf80dcc 100644
--- a/src/content/docs/zh-cn/reference/api-reference.mdx
+++ b/src/content/docs/zh-cn/reference/api-reference.mdx
@@ -32,7 +32,7 @@ const posts = await Astro.glob('../pages/post/*.md'); // 返回位于 ./src/page
`.glob()` 只需要一个参数：你想导入的本地文件相对 glob URL。它是异步的并返回数组，这个数组包含匹配文件的导出内容。
-`.glob()` 不接受使用变量或字符串进行插值，因为它们不是静态可分析的。(参见[故障排查](/zh-cn/guides/troubleshooting/#支持的值)以了解解决方法)。这是因为 `Astro.glob()` 是 Vite 的 [`import.meta.glob()`](https://cn.vitejs.dev/guide/features.html#glob-import) 的包装器。
+`.glob()` 不接受使用变量或字符串进行插值，因为它们不是静态可分析的。(参见[故障排查](/zh-cn/guides/troubleshooting/#支持的值)以了解解决方法)。这是因为 `Astro.glob()` 是 Vite 的 [`import.meta.glob()`](https://cn.vite.dev/guide/features.html#glob-import) 的包装器。
:::note
你也可以在你的 Astro 项目中使用 `import.meta.glob()`。你可能想在以下情况下这样做：
@@ -42,7 +42,7 @@ const posts = await Astro.glob('../pages/post/*.md'); // 返回位于 ./src/page
- 你想访问每个文件的路径。`import.meta.glob()` 返回文件路径到其内容的映射，而 `Astro.glob()` 返回内容的列表。
- 你想传递多种模式；例如，你想添加一个“负模式”，过滤掉某些文件。`import.meta.glob()` 可以选择接受 glob 字符串数组，而不是单个字符串。
-在 [Vite 文档](https://cn.vitejs.dev/guide/features.html#glob-import)中阅读更多内容。
+在 [Vite 文档](https://cn.vite.dev/guide/features.html#glob-import)中阅读更多内容。
:::
#### Markdown 文件
@@ -1354,7 +1354,7 @@ const { page } = Astro.props;
## `import.meta`
-所有 ESM 模块都包含 `import.meta` 属性。Astro 基于 [Vite](https://cn.vitejs.dev/guide/env-and-mode.html) 增加了 `import.meta.env`。
+所有 ESM 模块都包含 `import.meta` 属性。Astro 基于 [Vite](https://cn.vite.dev/guide/env-and-mode.html) 增加了 `import.meta.env`。
**`import.meta.env.SSR`** 可以用来了解何时在服务器渲染。有时你可能想要不同的逻辑，例如，某个组件应该只在客户端渲染：
diff --git a/src/content/docs/zh-cn/reference/cli-reference.mdx b/src/content/docs/zh-cn/reference/cli-reference.mdx
index 8681ac6b45021..dd63dff69e531 100644
--- a/src/content/docs/zh-cn/reference/cli-reference.mdx
+++ b/src/content/docs/zh-cn/reference/cli-reference.mdx
@@ -503,7 +503,7 @@ Node HTTP 原始请求的句柄。你可以使用 [`http.IncomingMessage`](https
##### `watcher`
-[Vite 开发服务器](https://cn.vitejs.dev/guide/api-javascript#vitedevserver) 公开的 [Chokidar 文件监听器](https://github.com/paulmillr/chokidar#getting-started)。
+[Vite 开发服务器](https://cn.vite.dev/guide/api-javascript#vitedevserver) 公开的 [Chokidar 文件监听器](https://github.com/paulmillr/chokidar#getting-started)。
##### `stop()`
diff --git a/src/content/docs/zh-cn/reference/configuration-reference.mdx b/src/content/docs/zh-cn/reference/configuration-reference.mdx
index 806c8664d44e7..8bd6f35863a4a 100644
--- a/src/content/docs/zh-cn/reference/configuration-reference.mdx
+++ b/src/content/docs/zh-cn/reference/configuration-reference.mdx
@@ -365,7 +365,7 @@ $ astro build --root ./my-project-directory