├── .editorconfig ├── .github ├── CONTRIBUTING.md ├── FUNDING.yml └── workflows │ └── ryo-cho.yml ├── .gitignore ├── .prettierrc.json ├── CONTRIBUTING.md ├── LICENSE ├── README.md ├── docs ├── .vitepress │ ├── buildEnd.config.ts │ ├── config.ts │ ├── theme │ │ ├── components │ │ │ ├── AsideSponsors.vue │ │ │ ├── BlogIndex.vue │ │ │ ├── SvgImage.vue │ │ │ ├── YouTubeVideo.vue │ │ │ └── landing │ │ │ │ ├── common │ │ │ │ └── SvgNode.vue │ │ │ │ ├── community-section │ │ │ │ ├── CommunityCard.vue │ │ │ │ └── CommunitySection.vue │ │ │ │ ├── feature-section │ │ │ │ ├── FeatureCI.vue │ │ │ │ ├── FeatureFlexiblePlugins.vue │ │ │ │ ├── FeatureHMR.vue │ │ │ │ ├── FeatureInstantServerStart.vue │ │ │ │ ├── FeatureOptimizedBuild.vue │ │ │ │ ├── FeatureRichFeatures.vue │ │ │ │ ├── FeatureSSRSupport.vue │ │ │ │ ├── FeatureSection.vue │ │ │ │ ├── FeatureTypedAPI.vue │ │ │ │ └── images │ │ │ │ │ ├── css3.svg │ │ │ │ │ ├── js.svg │ │ │ │ │ ├── json.svg │ │ │ │ │ ├── postcss.svg │ │ │ │ │ ├── ts.svg │ │ │ │ │ └── wa.svg │ │ │ │ ├── frameworks-section │ │ │ │ ├── FrameworkCard.vue │ │ │ │ ├── FrameworksSection.vue │ │ │ │ └── images │ │ │ │ │ ├── adonis.svg │ │ │ │ │ ├── analog.svg │ │ │ │ │ ├── angular.svg │ │ │ │ │ ├── astro.svg │ │ │ │ │ ├── ember.svg │ │ │ │ │ ├── hono.svg │ │ │ │ │ ├── laravel.svg │ │ │ │ │ ├── marko.svg │ │ │ │ │ ├── nuxt.svg │ │ │ │ │ ├── playwright.svg │ │ │ │ │ ├── preact.svg │ │ │ │ │ ├── qwik.svg │ │ │ │ │ ├── react.svg │ │ │ │ │ ├── redwood.svg │ │ │ │ │ ├── remix.svg │ │ │ │ │ ├── solid.svg │ │ │ │ │ ├── storybook.svg │ │ │ │ │ ├── svelte.svg │ │ │ │ │ ├── vitest.svg │ │ │ │ │ └── vue.svg │ │ │ │ ├── get-started-section │ │ │ │ └── GetStartedSection.vue │ │ │ │ ├── hero-section │ │ │ │ ├── HeroDiagram.vue │ │ │ │ ├── HeroSection.vue │ │ │ │ └── svg-elements │ │ │ │ │ ├── SvgBlueIndicator.vue │ │ │ │ │ ├── SvgInputs.vue │ │ │ │ │ ├── SvgOutputs.vue │ │ │ │ │ └── SvgPinkIndicator.vue │ │ │ │ └── sponsor-section │ │ │ │ └── SponsorSection.vue │ │ ├── composables │ │ │ ├── sponsor.ts │ │ │ ├── useCardAnimation.ts │ │ │ └── useSlideIn.ts │ │ ├── index.ts │ │ └── styles │ │ │ ├── landing.css │ │ │ └── vars.css │ └── tsconfig.json ├── _data │ ├── blog.data.ts │ └── team.js ├── blog.md ├── blog │ ├── announcing-vite2.md │ ├── announcing-vite3.md │ ├── announcing-vite4-3.md │ ├── announcing-vite4.md │ ├── announcing-vite5-1.md │ ├── announcing-vite5.md │ └── announcing-vite6.md ├── changes │ ├── hotupdate-hook.md │ ├── index.md │ ├── per-environment-apis.md │ ├── shared-plugins-during-build.md │ ├── ssr-using-modulerunner.md │ └── this-environment-in-hooks.md ├── config │ ├── build-options.md │ ├── dep-optimization-options.md │ ├── index.md │ ├── preview-options.md │ ├── server-options.md │ ├── shared-options.md │ ├── ssr-options.md │ └── worker-options.md ├── guide │ ├── api-environment-frameworks.md │ ├── api-environment-instances.md │ ├── api-environment-plugins.md │ ├── api-environment-runtimes.md │ ├── api-environment.md │ ├── api-hmr.md │ ├── api-javascript.md │ ├── api-plugin.md │ ├── assets.md │ ├── backend-integration.md │ ├── build.md │ ├── cli.md │ ├── comparisons.md │ ├── dep-pre-bundling.md │ ├── env-and-mode.md │ ├── features.md │ ├── index.md │ ├── migration.md │ ├── performance.md │ ├── philosophy.md │ ├── ssr.md │ ├── static-deploy.md │ ├── troubleshooting.md │ ├── using-plugins.md │ └── why.md ├── images │ ├── bundler.svg │ ├── community │ │ └── placeholder.jpg │ ├── diagrams.fig │ ├── esm.svg │ ├── graph.svg │ ├── lit.svg │ ├── preact.svg │ ├── react.svg │ ├── svelte.svg │ ├── v3-docs.png │ ├── v3-new-open-issues-and-PRs.png │ ├── v3-open-issues-and-PRs.png │ ├── vercel-configuration.png │ ├── vite-3-cold-start.svg │ ├── vite-environments.svg │ ├── vite-plugin-inspect.png │ ├── vite.svg │ └── vue.svg ├── index.md ├── plugins │ └── index.md ├── public │ ├── _headers │ ├── _redirects │ ├── astro.svg │ ├── ecosystem-vite4.png │ ├── github.svg │ ├── heart.svg │ ├── logo-home.svg │ ├── logo-uwu.png │ ├── logo-with-shadow.png │ ├── logo.svg │ ├── noise.png │ ├── nuxtlabs.svg │ ├── og-image-announcing-vite3.png │ ├── og-image-announcing-vite4-3.png │ ├── og-image-announcing-vite4.png │ ├── og-image-announcing-vite5-1.png │ ├── og-image-announcing-vite5.png │ ├── og-image-announcing-vite6.png │ ├── og-image.jpg │ ├── stackblitz.svg │ ├── vite.mp3 │ ├── vite4-3-hmr-time.png │ ├── vite4-3-startup-time.png │ ├── vite5-1-10K-modules-loading-time.png │ ├── vite6-npm-weekly-downloads.png │ ├── viteconf.svg │ ├── voice.svg │ └── voidzero.svg ├── releases.md └── team.md ├── netlify.toml ├── package.json ├── pnpm-lock.yaml └── renovate.json /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | charset = utf-8 5 | indent_style = space 6 | indent_size = 2 7 | end_of_line = lf 8 | insert_final_newline = true 9 | trim_trailing_whitespace = true -------------------------------------------------------------------------------- /.github/CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # Docs Translation Contributing Guide 2 | 3 | This repo is a template for [Vite.js docs translation repositories](https://github.com/vitejs?q=docs). 4 | 5 | ## Creating a Translation Repo 6 | 7 | 1. Click [*Use this template*](https://github.com/tony19/vite-docs-template/generate) to scaffold a new translation repo in your personal GitHub. 8 | 9 | 2. This repo uses the [`ryo-cho` GitHub Action](https://github.com/vuejs-translations/ryu-cho) to keep it in sync with changes from [Vite's `docs`](https://github.com/vitejs/vite/tree/main/docs). It creates pull requests in this repo that cherry-pick the upstream changes to be translated ([example](https://github.com/tony19/vite-docs-template/pull/4)). 10 | 11 | Edit the following fields in [`/.github/workflows/ryo-cho.yml`](/.github/workflows/ryo-cho.yml): 12 | 13 | * `upstream-repo` - the Git URL of your translation repo (the URL should end with `.git`) 14 | * `upstream-repo-branch` - the target branch in your translation repo 15 | 16 | By default, `ryo-cho` is configured to use the `github-actions` bot, which works out of the box. However, you can use your own bot by configuring the following: 17 | 18 | * `username` - the GitHub username of a [machine user](https://docs.github.com/en/developers/overview/managing-deploy-keys#machine-users) (e.g., `ci-bot`) 19 | * `email` - the email associated with the GitHub username above 20 | * `access-token` - a [personal access token](https://docs.github.com/en/authentication/keeping-your-account-and-data-secure/creating-a-personal-access-token) of the machine user (stored in a [repository secret](https://docs.github.com/en/actions/security-guides/encrypted-secrets#creating-encrypted-secrets-for-a-repository), enabling `access-token: ${{ secrets.MY_SECRET_TOKEN }}`) 21 | 22 | 3. Translate all user-visible strings (unless specified otherwise) in the following files to the target language: 23 | 24 | * [`/docs/.vitepress/config.ts`](/docs/.vitepress/config.ts) (the `og*`, `footer.*`, `text`, and `link` fields) 25 | * [`/docs/.vitepress/theme/components/HomeSponsors.vue`](/docs/.vitepress/theme/components/HomeSponsors.vue) 26 | * [`/docs/.vitepress/theme/composables/sponsor.ts`](https://github.com/tony19/vite-docs-template/blob/acea14e/docs/.vitepress/theme/composables/sponsor.ts#L44) (the `tier` fields) 27 | * [`/docs/_data/team.js`](/docs/_data/team.js) (the `title` and `desc` fields) 28 | * `/docs/**/*.md` 29 | * [`/CONTRIBUTING.md`](/CONTRIBUTING.md) 30 | * [`/README.md`](/README.md) 31 | * `/docs/images/*.svg` 32 | 33 | 💡 *Tips:* 34 | 35 | * *Ping the [`#docs` channel](https://discord.com/channels/804011606160703521/855049073157341234) in [Discord](https://chat.vite.dev) or [GitHub Discussions](https://github.com/vitejs/vite/discussions/categories/general) for others who can help with translations.* 36 | * *Submit pull requests in your repo for this work so that collaborators can proofread the translations.* 37 | 38 | 4. Create a [pull request in Vite's main repo](https://github.com/vitejs/vite/pulls) to update the [locale links in `docs/.vitepress/config.ts`](https://github.com/vitejs/vite/blob/1e078ad1902ae980741d6920fc3a72d182fcf179/docs/.vitepress/config.ts#L55-L62), which would add the new language to the dropdown on the Vite homepage. Specifically, append to `localeLinks.items[]` an object with these keys: 39 | 40 | - `text` - the language name in its native spelling (e.g., `Español`) 41 | - `link` - the URL to the target site, composed of the language's [ISO 639-1 code](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) as a subdomain of `https://vite.dev` (e.g., `https://es.vite.dev`) 42 | 43 | *Example for French:* 44 | 45 | ```js 46 | localeLinks: { 47 | items: [ 48 | { text: 'Française', link: 'https://fr.vite.dev' }, 49 | ] 50 | }, 51 | ``` 52 | 53 | 5. In the pull request's description, include the URL to your translation repo. Be prepared to [transfer the repo](https://docs.github.com/en/repositories/creating-and-managing-repositories/transferring-a-repository) to the [`vitejs` organization](https://github.com/vitejs) upon request by the [Vite team](https://github.com/orgs/vitejs/people). The transfer automatically adds you as a collaborator on the repo. The repo will be renamed to `docs-LANGUAGE_CODE` (e.g., `docs-fr`) after the transfer. 54 | 55 | **Thank you for your contribution!** ❤️ 56 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | # There are the supported funding model platforms 2 | 3 | open_collective: nazarepiedady 4 | -------------------------------------------------------------------------------- /.github/workflows/ryo-cho.yml: -------------------------------------------------------------------------------- 1 | name: ryu-cho 2 | 3 | on: 4 | schedule: 5 | - cron: "*/5 * * * *" 6 | 7 | jobs: 8 | ryu-cho: 9 | name: Ryu Cho 10 | runs-on: ubuntu-latest 11 | steps: 12 | - uses: vuejs-translations/ryu-cho@v1 13 | with: 14 | # GitHub access token. Required. 15 | access-token: ${{ secrets.GITHUB_TOKEN }} 16 | 17 | # Git user name to use when making issues and PRs. Required. 18 | username: vite/vitejs 19 | 20 | # Git email address to use when making issues and PRs. Required. 21 | email: "nazarepiedady@gmail.com" 22 | 23 | # The url for the upstream repo. This is the repository that you 24 | # set up Ryu-Cho. Required. 25 | # TODO: Replace this with your own repo URL 26 | upstream-repo: https://github.com/vitejs/docs-pt.git 27 | 28 | # The branch for the upstream repo. Optional. Defaults to `main`. 29 | # TODO: Replace this with your own repo's branch name 30 | upstream-repo-branch: main 31 | 32 | # The head repo to track. This is the repository you want to 33 | # take a diff. Required. 34 | head-repo: https://github.com/vitejs/vite 35 | 36 | # The branch for the head repo. Optional. Defaults to `main`. 37 | head-repo-branch: main 38 | 39 | # The git commit sha of head repo to start tracking. Ryu-Cho will 40 | # only track commit from this hash. Required. 41 | track-from: 344642ad630d8658308dbf707ed805cb04b49d58 42 | 43 | # File path to track. In this example, Ryu-Cho will only track 44 | # commits that modified files under `docs` folder. Optional. 45 | path-starts-with: docs/ 46 | 47 | # GitHub workflow name that runs Ryu-Cho. This is required since 48 | # Ryu-Cho determines the last run by looking into last workflow 49 | # run timestamp. Optional. Defaults to `ryu-cho`. 50 | workflow-name: ryu-cho 51 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | .idea/ 3 | docs/.vitepress/dist 4 | docs/.vitepress/temp 5 | .vscode 6 | docs/.vitepress/cache 7 | -------------------------------------------------------------------------------- /.prettierrc.json: -------------------------------------------------------------------------------- 1 | { 2 | "semi": false, 3 | "singleQuote": true, 4 | "overrides": [ 5 | { 6 | "files": ["*.json5"], 7 | "options": { 8 | "singleQuote": false, 9 | "quoteProps": "preserve" 10 | } 11 | }, 12 | { 13 | "files": ["*.yml"], 14 | "options": { 15 | "singleQuote": false 16 | } 17 | } 18 | ] 19 | } 20 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2019-present, VoidZero Inc. and Vite contributors 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 |

2 | 3 | Logótipo da Vite 4 | 5 |

6 |
7 |

8 | pacote de npm 9 | compatibilidade da node 10 | estado da construção 11 | conversa de discord 12 |

13 |
14 | 15 | # Vite ⚡ 16 | 17 | > Ferramentas de Frontend de Nova Geração 18 | 19 | - 💡 Inicialização do Servidor Instantânea 20 | - ⚡️ Substituição de Módulo Instantânea Extremamente Rápida 21 | - 🛠️ Funcionalidades Avançadas 22 | - 📦 Construção Otimizada 23 | - 🔩 Interface de Extensão Universal 24 | - 🔑 APIs Totalmente Tipificadas 25 | 26 | Vite (palavra Francesa para "rápido", pronunciada [`/vit/`](https://cdn.jsdelivr.net/gh/vitejs/vite@main/docs/public/vite.mp3), como "veet") é uma nova espécie de ferramenta de construção que melhora significativamente a experiência de programação do frontend. Ela consiste em duas partes principais: 27 | 28 | - Um servidor de desenvolvimento que serve os nossos ficheiros de fonte sobre os [módulos de ECMAScript nativo](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules), com [vastas funcionalidades embutidas](https://pt.vite.dev/guide/features), e [Substituição de Módulo Instantânea](https://pt.vite.dev/guide/features#hot-module-replacement) surpreendentemente rápida. 29 | 30 | - Um [comando de construção](https://pt.vite.dev/guide/build) que empacota o nosso código com [Rollup](https://rollupjs.org), pré-configurado para produzir recursos estáticos altamente otimizados para produção. 31 | 32 | Além disto, a Vite é altamente extensível através de sua [API de Extensão](https://pt.vite.dev/guide/api-plugin) e [API de JavaScript](https://pt.vite.dev/guide/api-javascript) como suporte completo a tipificação. 33 | 34 | [Ler a Documentação para Saber Mais](https://pt.vite.dev/). 35 | 36 | ## Pacotes 37 | 38 | | Pacote | Versão (clicar para relatório de mudanças) | 39 | | ------------------------------------------------- | :----------------------------------------------------------------------------------------------------------------------------------- | 40 | | [vite](packages/vite) | [![vite version](https://img.shields.io/npm/v/vite.svg?label=%20)](packages/vite/CHANGELOG.md) | 41 | | [@vitejs/plugin-vue](packages/plugin-vue) | [![plugin-vue version](https://img.shields.io/npm/v/@vitejs/plugin-vue.svg?label=%20)](packages/plugin-vue/CHANGELOG.md) | 42 | | [@vitejs/plugin-vue-jsx](packages/plugin-vue-jsx) | [![plugin-vue-jsx version](https://img.shields.io/npm/v/@vitejs/plugin-vue-jsx.svg?label=%20)](packages/plugin-vue-jsx/CHANGELOG.md) | 43 | | [@vitejs/plugin-react](packages/plugin-react) | [![plugin-react version](https://img.shields.io/npm/v/@vitejs/plugin-react.svg?label=%20)](packages/plugin-react/CHANGELOG.md) | 44 | | [@vitejs/plugin-legacy](packages/plugin-legacy) | [![plugin-legacy version](https://img.shields.io/npm/v/@vitejs/plugin-legacy.svg?label=%20)](packages/plugin-legacy/CHANGELOG.md) | 45 | | [create-vite](packages/create-vite) | [![create-vite version](https://img.shields.io/npm/v/create-vite.svg?label=%20)](packages/create-vite/CHANGELOG.md) | 46 | 47 | ## Contribuição 48 | 49 | Consulte o [Guia de Contribuição](CONTRIBUTING.md). 50 | 51 | ## Licença 52 | 53 | [MIT](LICENSE). 54 | 55 | ## Patrocinadores 56 | 57 |

58 | 59 | sponsors 60 | 61 |

62 | -------------------------------------------------------------------------------- /docs/.vitepress/buildEnd.config.ts: -------------------------------------------------------------------------------- 1 | import { Feed } from 'feed' 2 | import path from 'node:path' 3 | import { writeFileSync } from 'node:fs' 4 | import type { SiteConfig } from 'vitepress' 5 | import { createContentLoader } from 'vitepress' 6 | 7 | 8 | const SITE_URL = 'https://pt.vite.dev' 9 | const BLOG_URL = `${SITE_URL}/blog` 10 | 11 | export const buildEnd = async (config: SiteConfig): Promise => { 12 | const feed = new Feed({ 13 | title: 'Vite', 14 | description: 'Ferramentas de Frontend Modernas', 15 | id: BLOG_URL, 16 | link: BLOG_URL, 17 | language: 'pt', 18 | image: 'https://pt.vite.dev/og-image.png', 19 | favicon: 'https://pt.vite.dev/logo.svg', 20 | copyright: 'Direitos de Autor © 2019-presente VoidZero Inc. & Colaboradores da Vite', 21 | }) 22 | 23 | const posts = await createContentLoader('blog/*.md', { 24 | excerpt: true, 25 | render: true, 26 | }).load() 27 | 28 | posts.sort( 29 | (a, b) => 30 | +new Date(b.frontmatter.date as string) - 31 | +new Date(a.frontmatter.date as string), 32 | ) 33 | 34 | for (const { url, excerpt, frontmatter, html } of posts) { 35 | feed.addItem({ 36 | title: frontmatter.title, 37 | id: `${SITE_URL}${url}`, 38 | link: `${SITE_URL}${url}`, 39 | description: excerpt, 40 | content: html, 41 | author: [ 42 | { 43 | name: frontmatter.author.name, 44 | }, 45 | ], 46 | date: frontmatter.date, 47 | }) 48 | } 49 | 50 | writeFileSync(path.join(config.outDir, 'blog.rss'), feed.rss2()) 51 | } 52 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/AsideSponsors.vue: -------------------------------------------------------------------------------- 1 | 20 | 21 | 32 | 33 | 89 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/BlogIndex.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 23 | 24 | 47 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/SvgImage.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 8 | 9 | 23 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/YouTubeVideo.vue: -------------------------------------------------------------------------------- 1 | 6 | 19 | 35 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/common/SvgNode.vue: -------------------------------------------------------------------------------- 1 | 123 | 124 | 183 | 184 | 215 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/community-section/CommunityCard.vue: -------------------------------------------------------------------------------- 1 | 31 | 32 | 54 | 55 | 123 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/community-section/CommunitySection.vue: -------------------------------------------------------------------------------- 1 | 86 | 87 | 104 | 105 | 147 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/feature-section/images/css3.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/feature-section/images/js.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/feature-section/images/json.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/feature-section/images/ts.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/feature-section/images/wa.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/FrameworkCard.vue: -------------------------------------------------------------------------------- 1 | 44 | 45 | 62 | 63 | 128 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/adonis.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/angular.svg: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/astro.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/ember.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/hono.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/laravel.svg: -------------------------------------------------------------------------------- 1 | 2 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/nuxt.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/playwright.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/preact.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/qwik.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/react.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/redwood.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/remix.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/solid.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/storybook.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/svelte.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/vitest.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/frameworks-section/images/vue.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/hero-section/HeroSection.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 43 | 44 | 137 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/hero-section/svg-elements/SvgInputs.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 52 | 53 | 66 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/components/landing/hero-section/svg-elements/SvgOutputs.vue: -------------------------------------------------------------------------------- 1 | 12 | 13 | 48 | 49 | 57 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/composables/sponsor.ts: -------------------------------------------------------------------------------- 1 | import { onMounted, onUnmounted, ref } from 'vue' 2 | 3 | interface Sponsors { 4 | special: Sponsor[] 5 | platinum: Sponsor[] 6 | platinum_china: Sponsor[] 7 | gold: Sponsor[] 8 | silver: Sponsor[] 9 | bronze: Sponsor[] 10 | } 11 | 12 | interface Sponsor { 13 | name: string 14 | img: string 15 | url: string 16 | /** 17 | * Expects to also have an **inversed** image with `-dark` postfix. 18 | */ 19 | hasDark?: true 20 | } 21 | 22 | // shared data across instances so we load only once. 23 | const data = ref() 24 | 25 | const dataHost = 'https://sponsors.vuejs.org' 26 | const dataUrl = `${dataHost}/vite.json` 27 | 28 | export const voidZero = { 29 | name: 'VoidZero', 30 | url: 'https://voidzero.dev', 31 | img: '/voidzero.svg', 32 | } satisfies Sponsor 33 | 34 | const viteSponsors: Pick = { 35 | special: [ 36 | // sponsors patak-dev 37 | { 38 | name: 'StackBlitz', 39 | url: 'https://stackblitz.com', 40 | img: '/stackblitz.svg', 41 | }, 42 | // sponsors antfu 43 | { 44 | name: 'NuxtLabs', 45 | url: 'https://nuxtlabs.com', 46 | img: '/nuxtlabs.svg', 47 | }, 48 | // sponsors bluwy 49 | { 50 | name: 'Astro', 51 | url: 'https://astro.build', 52 | img: '/astro.svg', 53 | }, 54 | ], 55 | gold: [ 56 | // now automated via sponsors.vuejs.org too 57 | ], 58 | } 59 | 60 | function toggleDarkLogos() { 61 | if (data.value) { 62 | const isDark = document.documentElement.classList.contains('dark') 63 | data.value.forEach(({ items }) => { 64 | items.forEach((s: Sponsor) => { 65 | if (s.hasDark) { 66 | s.img = isDark 67 | ? s.img.replace(/(\.\w+)$/, '-dark$1') 68 | : s.img.replace(/-dark(\.\w+)$/, '$1') 69 | } 70 | }) 71 | }) 72 | } 73 | } 74 | 75 | export function useSponsor() { 76 | onMounted(async () => { 77 | const ob = new MutationObserver((list) => { 78 | for (const m of list) { 79 | if (m.attributeName === 'class') { 80 | toggleDarkLogos() 81 | } 82 | } 83 | }) 84 | ob.observe(document.documentElement, { attributes: true }) 85 | onUnmounted(() => { 86 | ob.disconnect() 87 | }) 88 | 89 | if (data.value) { 90 | return 91 | } 92 | 93 | const result = await fetch(dataUrl) 94 | const json = await result.json() 95 | 96 | data.value = mapSponsors(json) 97 | toggleDarkLogos() 98 | }) 99 | 100 | return { 101 | data, 102 | } 103 | } 104 | 105 | function mapSponsors(sponsors: Sponsors) { 106 | return [ 107 | { 108 | tier: 'em parceria com a', 109 | size: 'big', 110 | items: viteSponsors['special'], 111 | }, 112 | { 113 | tier: 'Patrocinadores de Platina', 114 | size: 'big', 115 | items: mapImgPath(sponsors['platinum']), 116 | }, 117 | { 118 | tier: 'Patrocinadores de Ouro', 119 | size: 'medium', 120 | items: [...mapImgPath(sponsors['gold']), ...viteSponsors['gold']], 121 | }, 122 | ] 123 | } 124 | 125 | const viteSponsorNames = new Set( 126 | Object.values(viteSponsors).flatMap((sponsors) => 127 | sponsors.map((s) => s.name), 128 | ), 129 | ) 130 | 131 | /** 132 | * Map Vue/Vite sponsors data to objects and filter out Vite-specific sponsors 133 | */ 134 | function mapImgPath(sponsors: Sponsor[]) { 135 | return sponsors 136 | .filter((sponsor) => !viteSponsorNames.has(sponsor.name)) 137 | .map((sponsor) => ({ 138 | ...sponsor, 139 | img: `${dataHost}/images/${sponsor.img}`, 140 | })) 141 | } 142 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/composables/useCardAnimation.ts: -------------------------------------------------------------------------------- 1 | import { type Ref, onMounted, onUnmounted, ref } from 'vue' 2 | import { gsap } from 'gsap' 3 | import { ScrollTrigger } from 'gsap/dist/ScrollTrigger' 4 | 5 | gsap.registerPlugin(ScrollTrigger) 6 | 7 | /** 8 | * A custom hook for animating a card element. 9 | * 10 | * @param {HTMLElement | string} el - The element or selector for the element to be animated 11 | * @param {() => GSAPTimeline | null} animation - A function that returns a GSAP timeline for the animation 12 | * @param {object} options - Options for the animation 13 | */ 14 | export function useCardAnimation( 15 | el: HTMLElement | string, 16 | animation: (() => GSAPTimeline) | undefined = undefined, 17 | options?: { 18 | /** 19 | * A flag to indicate whether the animation should only run once, and not reset once complete. 20 | */ 21 | once?: boolean 22 | }, 23 | ) { 24 | /** 25 | * The GSAP timeline for this animation. 26 | */ 27 | let timeline: GSAPTimeline | null 28 | 29 | /** 30 | * A flag to indicate whether the card is currently active or not. 31 | * May be inactive while the animation is still finishing up, due to CSS transitions. 32 | */ 33 | const isCardActive: Ref = ref(false) 34 | 35 | /** 36 | * An internal flag to prevent multiple animations from running at the same time. 37 | */ 38 | const isAnimationRunning: Ref = ref(false) 39 | 40 | /** 41 | * Starts the card's animation, managing the lifecycle internally to prevent multiple animations from running at the same time. 42 | */ 43 | const startAnimation = () => { 44 | if (isAnimationRunning.value) { 45 | return 46 | } else { 47 | isAnimationRunning.value = true 48 | isCardActive.value = true 49 | } 50 | if (timeline) { 51 | timeline.kill() 52 | } 53 | if (!animation) { 54 | return 55 | } 56 | timeline = gsap.timeline({ 57 | onComplete: () => { 58 | if (!options?.once) { 59 | isCardActive.value = false 60 | setTimeout(() => { 61 | isAnimationRunning.value = false 62 | }, 3000) 63 | } 64 | }, 65 | }) 66 | timeline.add(animation()) 67 | } 68 | 69 | /** 70 | * The ScrollTrigger instance for this card. 71 | */ 72 | let scrollTriggerInstance: ScrollTrigger | null = null 73 | 74 | /** 75 | * Trigger's the card's animation automatically on mobile devices (no hover method) 76 | */ 77 | onMounted(() => { 78 | if (window.innerWidth < 768) { 79 | scrollTriggerInstance = ScrollTrigger.create({ 80 | trigger: el, 81 | start: 'top 60%', 82 | onEnter: () => { 83 | startAnimation() 84 | }, 85 | }) 86 | } 87 | }) 88 | 89 | /** 90 | * Remove the ScrollTrigger and GSAP timeline instances when the component is unmounted 91 | */ 92 | onUnmounted(() => { 93 | if (scrollTriggerInstance) { 94 | scrollTriggerInstance.kill() 95 | scrollTriggerInstance = null 96 | } 97 | if (timeline) { 98 | timeline.kill() 99 | timeline = null 100 | } 101 | }) 102 | 103 | return { 104 | startAnimation, 105 | isCardActive, 106 | } 107 | } 108 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/composables/useSlideIn.ts: -------------------------------------------------------------------------------- 1 | import { nextTick, onMounted } from 'vue' 2 | import { gsap } from 'gsap' 3 | 4 | export function useSlideIn(el: HTMLElement | string) { 5 | onMounted(async () => { 6 | await nextTick(() => { 7 | gsap.to(el, { 8 | x: 0, 9 | duration: 1, 10 | ease: 'power3.out', 11 | scrollTrigger: { 12 | trigger: el, 13 | start: 'top 100%', 14 | once: true, 15 | }, 16 | }) 17 | }) 18 | }) 19 | } 20 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/index.ts: -------------------------------------------------------------------------------- 1 | import { h } from 'vue' 2 | import type { Theme } from 'vitepress' 3 | import DefaultTheme from 'vitepress/theme' 4 | import SvgImage from './components/SvgImage.vue' 5 | import AsideSponsors from './components/AsideSponsors.vue' 6 | import TwoslashFloatingVue from '@shikijs/vitepress-twoslash/client' 7 | import '@shikijs/vitepress-twoslash/style.css' 8 | import './styles/vars.css' 9 | import './styles/landing.css' 10 | import YouTubeVideo from './components/YouTubeVideo.vue' 11 | import 'virtual:group-icons.css' 12 | 13 | export default { 14 | extends: DefaultTheme, 15 | Layout() { 16 | return h(DefaultTheme.Layout, null, { 17 | 'aside-ads-before': () => h(AsideSponsors) 18 | }) 19 | }, 20 | enhanceApp({ app }) { 21 | app.component('SvgImage', SvgImage) 22 | app.component('YouTubeVideo', YouTubeVideo) 23 | app.use(TwoslashFloatingVue) 24 | } 25 | } satisfies Theme 26 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/styles/landing.css: -------------------------------------------------------------------------------- 1 | /* /////////////////////// */ 2 | /* Landing Page CSS Styles */ 3 | /* /////////////////////// */ 4 | 5 | html:has(.landing) { 6 | --vp-c-bg: #101010; 7 | 8 | background-color: #101010; 9 | 10 | body { 11 | background-color: #101010; 12 | } 13 | } 14 | 15 | .landing { 16 | overflow-x: hidden; 17 | background-color: #101010; 18 | 19 | * { 20 | -webkit-font-smoothing: antialiased !important; 21 | -moz-osx-font-smoothing: grayscale !important; 22 | text-rendering: optimizeLegibility !important; 23 | } 24 | 25 | /* /////////////////// */ 26 | /* VitePress Overrides */ 27 | /* /////////////////// */ 28 | 29 | .VPNavBar, 30 | .VPNavBar:not(.top) { 31 | background: transparent !important; 32 | 33 | @media (min-width: 768px) { 34 | backdrop-filter: blur(10px); 35 | background: rgba(15, 15, 15, 0.8) !important; 36 | border-bottom: 1px solid #262626 !important; 37 | } 38 | 39 | .content-body { 40 | background: none !important; 41 | transition: none; 42 | } 43 | } 44 | 45 | .VPNavBar *:not(.wrapper *) { 46 | transition: none; 47 | } 48 | 49 | .VPFooter { 50 | border-top: 1px solid #262626 !important; 51 | background: radial-gradient(circle at top center, #0f151a 30%, #000000 80%); 52 | } 53 | 54 | .VPHome { 55 | padding-bottom: 0 !important; 56 | margin-bottom: 0 !important; 57 | } 58 | 59 | /* /////////////// */ 60 | /* Force Dark Mode */ 61 | /* /////////////// */ 62 | 63 | .VPNavBarAppearance { 64 | display: none; 65 | } 66 | 67 | .VPMenu .translations + .group { 68 | display: none; 69 | } 70 | 71 | .VPNavScreenAppearance { 72 | visibility: hidden; 73 | } 74 | 75 | .social-links::before { 76 | margin-left: 0 !important; 77 | } 78 | 79 | /* ////////// */ 80 | /* Typography */ 81 | /* ////////// */ 82 | 83 | h1 { 84 | text-align: center; 85 | font-family: 'Manrope', sans-serif; 86 | font-style: normal; 87 | font-weight: 600; 88 | background: linear-gradient( 89 | 180deg, 90 | #fff 0%, 91 | rgba(255, 255, 255, 0.31) 100% 92 | ); 93 | background-clip: text; 94 | -webkit-background-clip: text; 95 | -webkit-text-fill-color: transparent; 96 | text-wrap: balance; 97 | cursor: default; 98 | font-size: 44px; 99 | line-height: 120%; 100 | letter-spacing: -0.88px; 101 | padding: 0 20px; 102 | margin-bottom: 15px; 103 | 104 | @media (min-width: 768px) { 105 | font-size: 64px; 106 | line-height: 81px; 107 | letter-spacing: -1.28px; 108 | } 109 | 110 | @media (min-width: 1025px) { 111 | font-size: 72px; 112 | letter-spacing: -1.44px; 113 | padding-bottom: 8px; /* Fix for hanging descender on "g" in "tooling" */ 114 | } 115 | } 116 | 117 | h2 { 118 | display: block; 119 | width: fit-content; 120 | font-family: Manrope, sans-serif; 121 | font-size: 32px; 122 | font-style: normal; 123 | font-weight: 600; 124 | line-height: 120%; 125 | letter-spacing: -0.64px; 126 | cursor: default; 127 | text-wrap: balance; 128 | padding: 0 20px; 129 | 130 | @media (min-width: 768px) { 131 | font-size: 44px; 132 | letter-spacing: -0.88px; 133 | } 134 | } 135 | 136 | h3 { 137 | color: #a9a9a9; 138 | text-align: center; 139 | font-family: Inter, sans-serif; 140 | font-size: 20px; 141 | font-style: normal; 142 | font-weight: 400; 143 | line-height: 150%; 144 | letter-spacing: -0.4px; 145 | max-width: 500px; 146 | text-wrap: balance; 147 | cursor: default; 148 | margin-bottom: 25px; 149 | padding: 0 20px; 150 | } 151 | 152 | /* /////// */ 153 | /* Buttons */ 154 | /* /////// */ 155 | 156 | .btn { 157 | display: flex; 158 | padding: 10px 18px; 159 | justify-content: center; 160 | align-items: center; 161 | gap: 8px; 162 | border-radius: 8px; 163 | color: #fff; 164 | font-family: Inter, sans-serif; 165 | font-size: 16px; 166 | font-style: normal; 167 | font-weight: 500; 168 | line-height: 24px; 169 | text-shadow: 0 0 2px rgba(0, 0, 0, 0.2); 170 | transition: all 0.2s ease-in-out; 171 | width: fit-content; 172 | 173 | &:hover { 174 | transform: translate3d(0, -2px, 0); 175 | } 176 | 177 | &.btn--primary { 178 | position: relative; 179 | background: radial-gradient( 180 | 141.42% 141.42% at 100% 0%, 181 | rgba(255, 255, 255, 0.4) 0%, 182 | rgba(255, 255, 255, 0) 100% 183 | ), 184 | radial-gradient( 185 | 140.35% 140.35% at 100% 94.74%, 186 | #bd34fe 0%, 187 | rgba(189, 52, 254, 0) 100% 188 | ), 189 | radial-gradient( 190 | 89.94% 89.94% at 18.42% 15.79%, 191 | #41d1ff 0%, 192 | rgba(65, 209, 255, 0) 100% 193 | ); 194 | box-shadow: 0 1px 0 0 rgba(255, 255, 255, 0.75) inset; 195 | 196 | &:hover { 197 | background: radial-gradient( 198 | 141.42% 141.42% at 100% 0%, 199 | rgba(255, 255, 255, 0.5) 0%, 200 | rgba(255, 255, 255, 0) 100% 201 | ), 202 | radial-gradient( 203 | 140.35% 140.35% at 100% 94.74%, 204 | #bd34fe 0%, 205 | rgba(189, 52, 254, 0) 100% 206 | ), 207 | radial-gradient( 208 | 89.94% 89.94% at 18.42% 15.79%, 209 | #41d1ff 0%, 210 | rgba(65, 209, 255, 0) 100% 211 | ); 212 | box-shadow: 0 1.5px 0 0 rgba(255, 255, 255, 0.8) inset; 213 | } 214 | } 215 | 216 | &.btn--outline { 217 | border: 1px solid rgba(255, 255, 255, 0.2); 218 | 219 | &:hover { 220 | border: 1px solid rgba(255, 255, 255, 0.4); 221 | } 222 | } 223 | 224 | &.btn--rounded { 225 | border-radius: 100px; 226 | } 227 | } 228 | } 229 | -------------------------------------------------------------------------------- /docs/.vitepress/theme/styles/vars.css: -------------------------------------------------------------------------------- 1 | /** 2 | * Colors 3 | * -------------------------------------------------------------------------- */ 4 | 5 | :root { 6 | --vp-c-brand: #646cff; 7 | --vp-c-brand-light: #747bff; 8 | --vp-c-brand-lighter: #9499ff; 9 | --vp-c-brand-lightest: #bcc0ff; 10 | --vp-c-brand-dark: #535bf2; 11 | --vp-c-brand-darker: #454ce1; 12 | --vp-c-brand-dimm: rgba(100, 108, 255, 0.08); 13 | } 14 | 15 | /** 16 | * Component: Button 17 | * -------------------------------------------------------------------------- */ 18 | 19 | :root { 20 | --vp-button-brand-border: var(--vp-c-brand-light); 21 | --vp-button-brand-text: var(--vp-c-white); 22 | --vp-button-brand-bg: var(--vp-c-brand); 23 | --vp-button-brand-hover-border: var(--vp-c-brand-light); 24 | --vp-button-brand-hover-text: var(--vp-c-white); 25 | --vp-button-brand-hover-bg: var(--vp-c-brand-light); 26 | --vp-button-brand-active-border: var(--vp-c-brand-light); 27 | --vp-button-brand-active-text: var(--vp-c-white); 28 | --vp-button-brand-active-bg: var(--vp-button-brand-bg); 29 | } 30 | 31 | /** 32 | * Component: Custom Block 33 | * -------------------------------------------------------------------------- */ 34 | 35 | :root { 36 | --vp-custom-block-tip-border: var(--vp-c-brand); 37 | --vp-custom-block-tip-text: var(--vp-c-brand-darker); 38 | --vp-custom-block-tip-bg: var(--vp-c-brand-dimm); 39 | } 40 | 41 | .dark { 42 | --vp-custom-block-tip-border: var(--vp-c-brand); 43 | --vp-custom-block-tip-text: var(--vp-c-brand-lightest); 44 | --vp-custom-block-tip-bg: var(--vp-c-brand-dimm); 45 | } 46 | 47 | /** 48 | * Component: Algolia 49 | * -------------------------------------------------------------------------- */ 50 | 51 | .DocSearch { 52 | --docsearch-primary-color: var(--vp-c-brand) !important; 53 | --docsearch-container-background: rgba(0, 0, 0, 0.7); 54 | } 55 | 56 | /** 57 | * VitePress: Custom fix 58 | * -------------------------------------------------------------------------- */ 59 | 60 | /* 61 | Use lighter colors for links in dark mode for a11y. 62 | Also specify some classes twice to have higher specificity 63 | over scoped class data attribute. 64 | */ 65 | .dark .vp-doc a, 66 | .dark .vp-doc a > code, 67 | .dark .VPNavBarMenuLink.VPNavBarMenuLink:hover, 68 | .dark .VPNavBarMenuLink.VPNavBarMenuLink.active, 69 | .dark .link.link:hover, 70 | .dark .link.link.active, 71 | .dark .edit-link-button.edit-link-button, 72 | .dark .pager-link .title { 73 | color: var(--vp-c-brand-lighter); 74 | } 75 | 76 | .dark .vp-doc a:hover, 77 | .dark .vp-doc a > code:hover { 78 | color: var(--vp-c-brand-lightest); 79 | opacity: 1; 80 | } 81 | 82 | /* Transition by color instead of opacity */ 83 | .dark .vp-doc .custom-block a { 84 | transition: color 0.25s; 85 | } 86 | 87 | .vp-sponsor.aside .vp-sponsor-grid.mini .vp-sponsor-grid-image { 88 | max-width: 124px; 89 | } 90 | 91 | .vp-sponsor-grid.big .vp-sponsor-grid-image { 92 | max-height: 96px; 93 | } 94 | 95 | .vp-sponsor-grid.mini .vp-sponsor-grid-image[alt='Bit'] { 96 | max-height: 48px; 97 | } 98 | 99 | .vp-sponsor-grid.xmini .vp-sponsor-grid-image[alt='JetBrains'] { 100 | max-height: 54px; 101 | } 102 | 103 | .vp-sponsor-grid.medium .vp-sponsor-grid-image[alt='JetBrains'] { 104 | max-height: 100px; 105 | } 106 | -------------------------------------------------------------------------------- /docs/.vitepress/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | "target": "ES2022", 4 | "module": "ESNext", 5 | "moduleResolution": "bundler", 6 | "strict": true, 7 | "noImplicitOverride": true, 8 | "noUnusedLocals": true, 9 | "esModuleInterop": true, 10 | "noEmit": true 11 | }, 12 | "exclude": ["cache", "dist"] 13 | } 14 | -------------------------------------------------------------------------------- /docs/_data/blog.data.ts: -------------------------------------------------------------------------------- 1 | import { createContentLoader } from 'vitepress' 2 | 3 | interface Post { 4 | title: string 5 | url: string 6 | date: { 7 | time: number 8 | string: string 9 | } 10 | } 11 | 12 | declare const data: Post[] 13 | export { data } 14 | 15 | export default createContentLoader('blog/*.md', { 16 | // excerpt: true, 17 | transform(raw): Post[] { 18 | return raw 19 | .map(({ url, frontmatter }) => ({ 20 | title: frontmatter.head.find((e) => e[1].property === 'og:title')[1].content, 21 | url, 22 | date: formatDate(frontmatter.date), 23 | })) 24 | .sort((a, b) => b.date.time - a.date.time) 25 | }, 26 | }) 27 | 28 | function formatDate(raw: string): Post['date'] { 29 | const date = new Date(raw) 30 | date.setUTCHours(12) 31 | return { 32 | time: +date, 33 | string: date.toLocaleDateString('en-US', { 34 | year: 'numeric', 35 | month: 'long', 36 | day: 'numeric', 37 | }), 38 | } 39 | } 40 | -------------------------------------------------------------------------------- /docs/blog.md: -------------------------------------------------------------------------------- 1 | --- 2 | sidebar: false 3 | editLink: false 4 | outline: false 5 | --- 6 | 7 | 10 | 11 | # Novidades do Blogue da Vite {#latest-from-the-vite-blog} 12 | 13 | 14 | -------------------------------------------------------------------------------- /docs/blog/announcing-vite4-3.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: A Vite 4.3 foi Lançada! 3 | author: 4 | name: A Equipa da Vite 5 | date: 2023-04-20 6 | sidebar: false 7 | head: 8 | - - meta 9 | - property: og:type 10 | content: website 11 | - - meta 12 | - property: og:title 13 | content: Anunciando a Vite 4.3 14 | - - meta 15 | - property: og:image 16 | content: https://pt.vite.dev/og-image-announcing-vite4-3.png 17 | - - meta 18 | - property: og:url 19 | content: https://pt.vite.dev/blog/announcing-vite4-3 20 | - - meta 21 | - property: og:description 22 | content: Anúncio do Lançamento da Vite 4.3 23 | - - meta 24 | - name: twitter:card 25 | content: summary_large_image 26 | --- 27 | 28 | # A Vite 4.3 foi Lançada! {#vite-4-3-is-out} 29 | 30 | _20 de Abril de 2023_ 31 | 32 | ![Imagem da Capa do Anúncio da Vite 4.3](/og-image-announcing-vite4-3.png) 33 | 34 | Ligações rápidas: 35 | 36 | - Documentações: [English](/), [简体中文](https://cn.vite.dev/), [日本語](https://ja.vite.dev/), [Español](https://es.vite.dev/), [Português](https://pt.vite.dev/) 37 | - [Relatório de Mudança da Vite 4.3](https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md#430-2023-04-20) 38 | 39 | ## Melhorias do Desempenho {#performance-improvements} 40 | 41 | Nesta atualização secundária, concentramos-nos em melhorar o desempenho do servidor de desenvolvimento. A lógica de resolução foi racionalizada, melhorando os caminhos principais e implementando armazenamento de consulta imediata mais inteligente para encontrar o `package.json`, ficheiros de configuração da TypeScript, e URL resolvidas em geral. 42 | 43 | Tu podes ler uma apresentação detalhada do trabalho de desempenho feito neste publicação de blogue por um dos colaboradores da Vite: [Como tornamos a Vite 4.3 muitíssimo mais rápida 🚀](https://sun0day.github.io/blog/vite/why-vite4_3-is-faster.html). 44 | 45 | Esta corrida resultou em melhorias da velocidade em todos os domínios comparada a Vite 4.2. 46 | 47 | Existem melhorias de desempenho conforme medida pela [sapphi-red/performance-compare](https://github.com/sapphi-red/performance-compare), que testa uma aplicação com 1000 componentes de React, tempo frio e quente de inicialização do servidor bem como tempos da substituição de módulo instantânea para um componente de raiz e página: 48 | 49 | | **Vite (babel)** | Vite 4.2 | Vite 4.3 | Melhoria | 50 | | :----------------- | --------: | -------: | ----------: | 51 | | **inicio frio do desenvolvimento** | 17249.0ms | 5132.4ms | -70.2% | 52 | | **inicio quente do desenvolvimento** | 6027.8ms | 4536.1ms | -24.7% | 53 | | **substituição de módulo instantânea da raiz** | 46.8ms | 26.7ms | -42.9% | 54 | | **substituição de módulo instantânea da página** | 27.0ms | 12.9ms | -52.2% | 55 | 56 | | **Vite (swc)** | Vite 4.2 | Vite 4.3 | Melhoria | 57 | | :----------------- | --------: | -------: | ----------: | 58 | | **inicio frio do desenvolvimento** | 13552.5ms | 3201.0ms | -76.4% | 59 | | **inicio quente do desenvolvimento** | 4625.5ms | 2834.4ms | -38.7% | 60 | | **substituição de módulo instantânea da raiz** | 30.5ms | 24.0ms | -21.3% | 61 | | **substituição de módulo instantânea da página** | 16.9ms | 10.0ms | -40.8% | 62 | 63 | ![Comparação do tempo de inicialização da Vite 4.3 vs 4.2](/vite4-3-startup-time.png) 64 | 65 | ![Comparação do tempo da substituição de módulo instantânea da Vite 4.3 vs 4.2](/vite4-3-hmr-time.png) 66 | 67 | Tu podes ler mais informações a respeito do marco de referência nesta [ligação](https://gist.github.com/sapphi-red/25be97327ee64a3c1dce793444afdf6e). Especificações e Versões para este desempenho executam: 68 | 69 | - CPU: Ryzen 9 5900X, Memory: DDR4-3600 32GB, SSD: WD Blue SN550 NVME SSD 70 | - Windows 10 Pro 21H2 19044.2846 71 | - Node.js 18.16.0 72 | - Versões da Extensão de Vite e React 73 | - Vite 4.2 (babel): Vite 4.2.1 + plugin-react 3.1.0 74 | - Vite 4.3 (babel): Vite 4.3.0 + plugin-react 4.0.0-beta.1 75 | - Vite 4.2 (swc): Vite 4.2.1 + plugin-react-swc 3.2.0 76 | - Vite 4.3 (swc): Vite 4.3.0 + plugin-react-swc 3.3.0 77 | 78 | Os primeiros a adotar também têm relatado perceber melhoria de tempo de inicialização do desenvolvimento 1.5x-2x em aplicações reais enquanto testam a Vite 4.3 beta. Adoraríamos saber os resultados para as tuas aplicações. 79 | 80 | ## Perfilamento {#profiling} 81 | 82 | Continuaremos a trabalhar no desempenho da Vite. Estamos a trabalhar numa [ferramenta de analise comparativa](https://github.com/vitejs/vite-benchmark) oficial para a Vite que nos permitirá ter métricas de desempenho para cada pedido de atualização do ramo principal do repositório. 83 | 84 | E a [`vite-plugin-inspect`](https://github.com/antfu/vite-plugin-inspect) agora tem mais funcionalidades relacionadas ao desempenho para ajudar-te a identificar quais extensões ou intermediários estão a causar congestionamento para as tuas aplicações. 85 | 86 | Usar `vite --profile` (e depois pressionando `p`) assim que a página carregar guardará um perfil da CPU da inicialização do servidor de desenvolvimento. Tu podes abri-los numa aplicação como [speedscope](https://www.speedscope.app/) para identificares os problemas de desempenho. E podes partilhar as tuas descobertas com a equipa da Vite numa [Discussão](https://github.com/vitejs/vite/discussions) ou na [Discorda da Vite](https://chat.vite.dev). 87 | 88 | ## Próximos Passos {#next-steps} 89 | 90 | Nós decidimos fazer uma única versão principal de Vite este ano alinhada com o [Fim da Vida da Node.js 16](https://endoflife.date/nodejs) em Setembro, desistindo do suporte para ambas Node.js 14 e 16 nela. Se gostarias de participar, começamos uma [Discussão sobre a Vite 5](https://github.com/vitejs/vite/discussions/12466) para reunir reações antecipadas. 91 | -------------------------------------------------------------------------------- /docs/changes/hotupdate-hook.md: -------------------------------------------------------------------------------- 1 | # HMR `hotUpdate` Plugin Hook 2 | 3 | ::: tip Feedback 4 | Give us feedback at [Environment API feedback discussion](https://github.com/vitejs/vite/discussions/16358) 5 | ::: 6 | 7 | We're planning to deprecate the `handleHotUpdate` plugin hook in favor of [`hotUpdate` hook](/guide/api-environment#the-hotupdate-hook) to be [Environment API](/guide/api-environment.md) aware, and handle additional watch events with `create` and `delete`. 8 | 9 | Affected scope: `Vite Plugin Authors` 10 | 11 | ::: warning Future Deprecation 12 | `hotUpdate` was first introduced in `v6.0`. The deprecation of `handleHotUpdate` is planned for `v7.0`. We don't yet recommend moving away from `handleHotUpdate` yet. If you want to experiment and give us feedback, you can use the `future.removePluginHookHandleHotUpdate` to `"warn"` in your vite config. 13 | ::: 14 | 15 | ## Motivation 16 | 17 | The [`handleHotUpdate` hook](/guide/api-plugin.md#handlehotupdate) allows to perform custom HMR update handling. A list of modules to be updated is passed in the `HmrContext` 18 | 19 | ```ts 20 | interface HmrContext { 21 | file: string 22 | timestamp: number 23 | modules: Array 24 | read: () => string | Promise 25 | server: ViteDevServer 26 | } 27 | ``` 28 | 29 | This hook is called once for all environments, and the passed modules have mixed information from the Client and SSR environments only. Once frameworks move to custom environments, a new hook that is called for each of them is needed. 30 | 31 | The new `hotUpdate` hook works in the same way as `handleHotUpdate` but it is called for each environment and receives a new `HotUpdateOptions` instance: 32 | 33 | ```ts 34 | interface HotUpdateOptions { 35 | type: 'create' | 'update' | 'delete' 36 | file: string 37 | timestamp: number 38 | modules: Array 39 | read: () => string | Promise 40 | server: ViteDevServer 41 | } 42 | ``` 43 | 44 | The current dev environment can be accessed like in other Plugin hooks with `this.environment`. The `modules` list will now be module nodes from the current environment only. Each environment update can define different update strategies. 45 | 46 | This hook is also now called for additional watch events and not only for `'update'`. Use `type` to differentiate between them. 47 | 48 | ## Migration Guide 49 | 50 | Filter and narrow down the affected module list so that the HMR is more accurate. 51 | 52 | ```js 53 | handleHotUpdate({ modules }) { 54 | return modules.filter(condition) 55 | } 56 | 57 | // Migrate to: 58 | 59 | hotUpdate({ modules }) { 60 | return modules.filter(condition) 61 | } 62 | ``` 63 | 64 | Return an empty array and perform a full reload: 65 | 66 | ```js 67 | handleHotUpdate({ server, modules, timestamp }) { 68 | // Invalidate modules manually 69 | const invalidatedModules = new Set() 70 | for (const mod of modules) { 71 | server.moduleGraph.invalidateModule( 72 | mod, 73 | invalidatedModules, 74 | timestamp, 75 | true 76 | ) 77 | } 78 | server.ws.send({ type: 'full-reload' }) 79 | return [] 80 | } 81 | 82 | // Migrate to: 83 | 84 | hotUpdate({ modules, timestamp }) { 85 | // Invalidate modules manually 86 | const invalidatedModules = new Set() 87 | for (const mod of modules) { 88 | this.environment.moduleGraph.invalidateModule( 89 | mod, 90 | invalidatedModules, 91 | timestamp, 92 | true 93 | ) 94 | } 95 | this.environment.hot.send({ type: 'full-reload' }) 96 | return [] 97 | } 98 | ``` 99 | 100 | Return an empty array and perform complete custom HMR handling by sending custom events to the client: 101 | 102 | ```js 103 | handleHotUpdate({ server }) { 104 | server.ws.send({ 105 | type: 'custom', 106 | event: 'special-update', 107 | data: {} 108 | }) 109 | return [] 110 | } 111 | 112 | // Migrate to... 113 | 114 | hotUpdate() { 115 | this.environment.hot.send({ 116 | type: 'custom', 117 | event: 'special-update', 118 | data: {} 119 | }) 120 | return [] 121 | } 122 | ``` 123 | -------------------------------------------------------------------------------- /docs/changes/index.md: -------------------------------------------------------------------------------- 1 | # Breaking Changes 2 | 3 | List of breaking changes in Vite including API deprecations, removals, and changes. Most of the changes below can be opt-in using the [`future` option](/config/shared-options.html#future) in your Vite config. 4 | 5 | ## Planned 6 | 7 | These changes are planned for the next major version of Vite. The deprecation or usage warnings will guide you where possible, and we're reaching out to framework, plugin authors, and users to apply these changes. 8 | 9 | - _No planned changes yet_ 10 | 11 | ## Considering 12 | 13 | These changes are being considered and are often experimental APIs that intend to improve upon current usage patterns. As not all changes are listed here, please check out the [Experimental Label in Vite GitHub Discussions](https://github.com/vitejs/vite/discussions/categories/feedback?discussions_q=label%3Aexperimental+category%3AFeedback) for the full list. 14 | 15 | We don't recommend switching to these APIs yet. They are included in Vite to help us gather feedback. Please check these proposals and let us know how they work in your use case in each's linked GitHub Discussions. 16 | 17 | - [`this.environment` in Hooks](/changes/this-environment-in-hooks) 18 | - [HMR `hotUpdate` Plugin Hook](/changes/hotupdate-hook) 19 | - [Move to per-environment APIs](/changes/per-environment-apis) 20 | - [SSR using `ModuleRunner` API](/changes/ssr-using-modulerunner) 21 | - [Shared plugins during build](/changes/shared-plugins-during-build) 22 | 23 | ## Past 24 | 25 | The changes below has been done or reverted. They are no longer relevant in the current major version. 26 | 27 | - _No past changes yet_ 28 | -------------------------------------------------------------------------------- /docs/changes/per-environment-apis.md: -------------------------------------------------------------------------------- 1 | # Move to per-environment APIs 2 | 3 | ::: tip Feedback 4 | Give us feedback at [Environment API feedback discussion](https://github.com/vitejs/vite/discussions/16358) 5 | ::: 6 | 7 | Multiple APIs from `ViteDevServer` related to module graph and modules transforms have been moved to the `DevEnvironment` instances. 8 | 9 | Affect scope: `Vite Plugin Authors` 10 | 11 | ::: warning Future Deprecation 12 | The `Environment` instance was first introduced at `v6.0`. The deprecation of `server.moduleGraph` and other methods that are now in environments is planned for `v7.0`. We don't recommend moving away from server methods yet. To identify your usage, set these in your vite config. 13 | 14 | ```ts 15 | future: { 16 | removeServerModuleGraph: 'warn', 17 | removeServerTransformRequest: 'warn', 18 | } 19 | ``` 20 | 21 | ::: 22 | 23 | ## Motivation 24 | 25 | In Vite v5 and before, a single Vite dev server always had two environments (`client` and `ssr`). The `server.moduleGraph` had mixed modules from both of these environments. Nodes were connected through `clientImportedModules` and `ssrImportedModules` lists (but a single `importers` list was maintained for each). A transformed module was represented by an `id` and a `ssr` boolean. This boolean needed to be passed to APIs, for example `server.moduleGraph.getModuleByUrl(url, ssr)` and `server.transformRequest(url, { ssr })`. 26 | 27 | In Vite v6, it is now possible to create any number of custom environments (`client`, `ssr`, `edge`, etc). A single `ssr` boolean isn't enough anymore. Instead of changing the APIs to be of the form `server.transformRequest(url, { environment })`, we moved these methods to the environment instance allowing them to be called without a Vite dev server. 28 | 29 | ## Migration Guide 30 | 31 | - `server.moduleGraph` -> [`environment.moduleGraph`](/guide/api-environment#separate-module-graphs) 32 | - `server.transformRequest(url, ssr)` -> `environment.transformRequest(url)` 33 | - `server.warmupRequest(url, ssr)` -> `environment.warmupRequest(url)` 34 | -------------------------------------------------------------------------------- /docs/changes/shared-plugins-during-build.md: -------------------------------------------------------------------------------- 1 | # Shared Plugins during Build 2 | 3 | ::: tip Feedback 4 | Give us feedback at [Environment API feedback discussion](https://github.com/vitejs/vite/discussions/16358) 5 | ::: 6 | 7 | See [Shared plugins during build](/guide/api-environment.md#shared-plugins-during-build). 8 | 9 | Affect scope: `Vite Plugin Authors` 10 | 11 | ::: warning Future Default Change 12 | `builder.sharedConfigBuild` was first introduce in `v6.0`. You can set it true to check how your plugins work with a shared config. We're looking for feedback about changing the default in a future major once the plugin ecosystem is ready. 13 | ::: 14 | 15 | ## Motivation 16 | 17 | Align dev and build plugin pipelines. 18 | 19 | ## Migration Guide 20 | 21 | To be able to share plugins across environments, plugin state must be keyed by the current environment. A plugin of the following form will count the number of transformed modules across all environments. 22 | 23 | ```js 24 | function CountTransformedModulesPlugin() { 25 | let transformedModules 26 | return { 27 | name: 'count-transformed-modules', 28 | buildStart() { 29 | transformedModules = 0 30 | }, 31 | transform(id) { 32 | transformedModules++ 33 | }, 34 | buildEnd() { 35 | console.log(transformedModules) 36 | }, 37 | } 38 | } 39 | ``` 40 | 41 | If we instead want to count the number of transformed modules for each environment, we need to keep a map: 42 | 43 | ```js 44 | function PerEnvironmentCountTransformedModulesPlugin() { 45 | const state = new Map() 46 | return { 47 | name: 'count-transformed-modules', 48 | perEnvironmentStartEndDuringDev: true, 49 | buildStart() { 50 | state.set(this.environment, { count: 0 }) 51 | } 52 | transform(id) { 53 | state.get(this.environment).count++ 54 | }, 55 | buildEnd() { 56 | console.log(this.environment.name, state.get(this.environment).count) 57 | } 58 | } 59 | } 60 | ``` 61 | 62 | To simplify this pattern, Vite exports a `perEnvironmentState` helper: 63 | 64 | ```js 65 | function PerEnvironmentCountTransformedModulesPlugin() { 66 | const state = perEnvironmentState<{ count: number }>(() => ({ count: 0 })) 67 | return { 68 | name: 'count-transformed-modules', 69 | perEnvironmentStartEndDuringDev: true, 70 | buildStart() { 71 | state(this).count = 0 72 | } 73 | transform(id) { 74 | state(this).count++ 75 | }, 76 | buildEnd() { 77 | console.log(this.environment.name, state(this).count) 78 | } 79 | } 80 | } 81 | ``` 82 | -------------------------------------------------------------------------------- /docs/changes/ssr-using-modulerunner.md: -------------------------------------------------------------------------------- 1 | # SSR using `ModuleRunner` API 2 | 3 | ::: tip Feedback 4 | Give us feedback at [Environment API feedback discussion](https://github.com/vitejs/vite/discussions/16358) 5 | ::: 6 | 7 | `server.ssrLoadModule` has been replaced by importing from a [Module Runner](/guide/api-environment#modulerunner). 8 | 9 | Affect scope: `Vite Plugin Authors` 10 | 11 | ::: warning Future Deprecation 12 | `ModuleRunner` was first introduce in `v6.0`. The deprecation of `server.ssrLoadModule` is planned for a future major. To identify your usage, set `future.removeSsrLoadModule` to `"warn"` in your vite config. 13 | ::: 14 | 15 | ## Motivation 16 | 17 | The `server.ssrLoadModule(url)` only allows importing modules in the `ssr` environment and can only execute the modules in the same process as the Vite dev server. For apps with custom environments, each is associated with a `ModuleRunner` that may be running in a separate thread or process. To import modules, we now have `moduleRunner.import(url)`. 18 | 19 | ## Migration Guide 20 | 21 | Check out the [Environment API for Frameworks Guide](../guide/api-environment-frameworks.md). 22 | -------------------------------------------------------------------------------- /docs/changes/this-environment-in-hooks.md: -------------------------------------------------------------------------------- 1 | # `this.environment` in Hooks 2 | 3 | ::: tip Feedback 4 | Give us feedback at [Environment API feedback discussion](https://github.com/vitejs/vite/discussions/16358) 5 | ::: 6 | 7 | Before Vite 6, only two environments were available: `client` and `ssr`. A single `options.ssr` plugin hook argument in `resolveId`, `load` and `transform` allowed plugin authors to differentiate between these two environments when processing modules in plugin hooks. In Vite 6, a Vite application can define any number of named environments as needed. We're introducing `this.environment` in the plugin context to interact with the environment of the current module in hooks. 8 | 9 | Affect scope: `Vite Plugin Authors` 10 | 11 | ::: warning Future Deprecation 12 | `this.environment` was introduced in `v6.0`. The deprecation of `options.ssr` is planned for `v7.0`. At that point we'll start recommending migrating your plugins to use the new API. To identify your usage, set `future.removePluginHookSsrArgument` to `"warn"` in your vite config. 13 | ::: 14 | 15 | ## Motivation 16 | 17 | `this.environment` not only allow the plugin hook implementation to know the current environment name, it also gives access to the environment config options, module graph information, and transform pipeline (`environment.config`, `environment.moduleGraph`, `environment.transformRequest()`). Having the environment instance available in the context allows plugin authors to avoid the dependency of the whole dev server (typically cached at startup through the `configureServer` hook). 18 | 19 | ## Migration Guide 20 | 21 | For the existing plugin to do a quick migration, replace the `options.ssr` argument with `this.environment.name !== 'client'` in the `resolveId`, `load` and `transform` hooks: 22 | 23 | ```ts 24 | import { Plugin } from 'vite' 25 | 26 | export function myPlugin(): Plugin { 27 | return { 28 | name: 'my-plugin', 29 | resolveId(id, importer, options) { 30 | const isSSR = options.ssr // [!code --] 31 | const isSSR = this.environment.name !== 'client' // [!code ++] 32 | 33 | if (isSSR) { 34 | // SSR specific logic 35 | } else { 36 | // Client specific logic 37 | } 38 | }, 39 | } 40 | } 41 | ``` 42 | 43 | For a more robust long term implementation, the plugin hook should handle for [multiple environments](/guide/api-environment.html#accessing-the-current-environment-in-hooks) using fine-grained environment options instead of relying on the environment name. 44 | -------------------------------------------------------------------------------- /docs/config/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Configurando a Vite 3 | --- 4 | 5 | # Configurando a Vite {#configuring-vite} 6 | 7 | Quando executamos a `vite` a partir da linha de comando, a Vite tentará resolver automaticamente um ficheiro de configuração chamado `vite.config.js` dentro da [raiz do projeto](/guide/#index-html-and-project-root) (outras extensões de JavaScript e TypeScript também são suportadas). 8 | 9 | O ficheiro de configuração mais elementar parece-se com isto: 10 | 11 | ```js [vite.config.js] 12 | export default { 13 | // opções de configuração 14 | } 15 | ``` 16 | 17 | Nota que a Vite suporta o uso da sintaxe de módulos de ECMAScript no ficheiro de configuração mesmo se o projeto não estiver a usar o módulo de ECMAScript da Node nativo, por exemplo, `"type": "module"` no `package.json`. Neste caso, o ficheiro de configuração é pré-processado automaticamente antes de carregar. 18 | 19 | Nós também podemos especificar explicitamente um ficheiro de configuração à usar com a opção da interface da linha de comando `--config` (resolvido relativamente ao `cwd`): 20 | 21 | ```bash 22 | vite --config my-config.js 23 | ``` 24 | 25 | :::tip EMPACOTAMENTO DA CONFIGURAÇÃO 26 | Por predefinição, a Vite usa a `esbuild` para empacotar a configuração num ficheiro temporário. Isto pode causar problemas ao importar ficheiros de TypeScript (`.ts`) em um mono-repositório. Se encontrarmos algum problema com esta abordagem, podemos especificar `--configLoader=runner` para usar o [executor do módulo](/guide/api-environment-runtimes#modulerunner), que não criará uma configuração temporária e transformará quaisquer ficheiros em tempo real. Notemos que o executor do módulo não suporta CJS (CommonJS) em ficheiros de configuração, mas os pacotes de CJS externos devem funcionar como habitualmente. 27 | 28 | Alternativamente, se estivermos a usar um ambiente que suporta TypeScript (por exemplo, `node --experimental-strip-types`), ou se estivermos apenas a escrever JavaScript puro, podemos especificar `--configLoader native` para usar a execução nativa do ambiente para carregar o ficheiro de configuração. Notemos que atualizações para módulos importados pelo ficheiro de configuração não são detetados e, por conseguinte, não reiniciam automaticamente o servidor da Vite. 29 | ::: 30 | 31 | ## Configuração do Sensor Inteligente {#config-intellisense} 32 | 33 | Uma vez que a Vite disponibiliza-se com tipos de TypeScript, podemos influenciar o sensor inteligente do nosso ambiente de desenvolvimento integrado com sugestões de tipo da `jsdoc`: 34 | 35 | ```js 36 | /** @type {import('vite').UserConfig} */ 37 | export default { 38 | // ... 39 | } 40 | ``` 41 | 42 | Alternativamente, podemos usar a auxiliar `defineConfig` que deve fornecer sensor inteligente sem a necessidade de anotações de `jsdoc`: 43 | 44 | ```js 45 | import { defineConfig } from 'vite' 46 | 47 | export default defineConfig({ 48 | // ... 49 | }) 50 | ``` 51 | 52 | A Vite também suporta diretamente os ficheiros de configuração de TypeScript. Nós também podemos usar o `vite.config.ts` com a auxiliar `defineConfig`. 53 | 54 | ## Configuração Condicional {#conditional-config} 55 | 56 | Se a configuração precisa determinar condicionalmente as opções baseadas no comando (`serve` ou `build`), no [modo](/guide/env-and-mode#modes) a ser usado, ou se for uma construção da interpretação do lado do servidor (`isSsrBuild`), ou é uma pré-visualização da construção (`isPreview`), esta pode exportar uma função: 57 | 58 | ```js 59 | import { defineConfig } from 'vite' 60 | 61 | export default defineConfig(({ command, mode, ssrBuild }) => { 62 | if (command === 'serve') { 63 | return { 64 | // configuração específica do desenvolvimento 65 | } 66 | } else { 67 | // command === 'build' 68 | return { 69 | // configuração específica da construção 70 | } 71 | } 72 | }) 73 | ``` 74 | 75 | É importante notar que na API da Vite o valor de `command` é `serve` durante o desenvolvimento (na interface da linha de comando [`vite`](/guide/cli#vite), `vite dev`, e `vite serve` são pseudónimos), e `build` quando construímos para produção ([`vite build`](/guide/cli#vite-build)). 76 | 77 | A `isSsrBuild` e `isPreview` são opções opcionais condicionais para diferenciar os tipos de comandos `build` e `serve` respetivamente. Algumas ferramentas que carregam a configuração da Vite não suportam estas opções e passarão `undefined`. Por isto, é recomendado usar comparação explícita contra `true` e `false`. 78 | 79 | ## Configuração Assíncrona {#async-config} 80 | 81 | Se a configuração precisar de chamar funções assíncronas, pode exportar uma função assíncrona. E esta função assíncrona também pode ser passada através da `defineConfig` para o suporte de sensor inteligente melhorado: 82 | 83 | ```js 84 | import { defineConfig } from 'vite' 85 | 86 | export default defineConfig(async ({ command, mode }) => { 87 | const data = await asyncFunction() 88 | return { 89 | // configuração de vite 90 | } 91 | }) 92 | ``` 93 | 94 | ## Usando Variáveis de Ambiente na Configuração {#using-environment-variables-in-config} 95 | 96 | As variáveis de ambiente podem ser obtidas a partir de `process.env` como de costume. 97 | 98 | Nota que a Vite não carrega os ficheiros `.env` por padrão visto que os ficheiros à carregar apenas podem ser determinados depois de avaliar a configuração da Vite, por exemplo, as opções `root` e `envDir` afetam o comportamento do carregamento. No entanto, podemos usar a auxiliar `loadEnv` exportada para carregar o ficheiro `.env` especifico se necessário: 99 | 100 | ```js twoslash 101 | import { defineConfig, loadEnv } from 'vite' 102 | 103 | export default defineConfig(({ mode }) => { 104 | // Carregar o ficheiro de ambiente baseado no `mode` no 105 | // diretório de trabalho atual. 106 | // Definir o terceiro parâmetro para '' para carregar todos os 107 | // ambientes apesar do prefixo `VITE_` 108 | const env = loadEnv(mode, process.cwd(), '') 109 | return { 110 | // configuração de vite 111 | define: { 112 | __APP_ENV__: JSON.stringify(env.APP_ENV), 113 | } 114 | } 115 | }) 116 | ``` 117 | -------------------------------------------------------------------------------- /docs/config/preview-options.md: -------------------------------------------------------------------------------- 1 | # Opções de Pré-visualização {#preview-options} 2 | 3 | ## `preview.host` {#preview-host} 4 | 5 | - **Tipo:** `string | boolean` 6 | - **Predefinido como:** [`server.host`](./server-options#server-host) 7 | 8 | Especifica quais endereços de IP o servidor deveria ouvir. 9 | Defina isto para `0.0.0.0` ou `true` para ouvir todos endereços, incluindo endereços públicos e privados. 10 | 11 | Isto pode ser definido através da interface de linha de comando utilizando `--host 0.0.0.0` ou `--host`. 12 | 13 | :::tip NOTA 14 | 15 | Existem casos onde outros servidores podem responder no lugar da Vite. 16 | Consulte [`server.host`](./server-options#server-host) para obter mais detalhes. 17 | 18 | ::: 19 | 20 | ## `preview.allowedHosts` {#preview-allowedhosts} 21 | 22 | - **Tipo:** `string | true` 23 | - **Predefinida como:** [`server.allowedHosts`](./server-options#server-allowedhosts) 24 | 25 | Os nomes de hospedeiros que a Vite está autorizada a responder. 26 | 27 | Consultar [`server.allowedHosts`](./server-options#server-allowedhosts) por mais detalhes. 28 | 29 | ## `preview.port` {#preview-port} 30 | 31 | - **Tipo:** `number` 32 | - **Predefinido como:** `4173` 33 | 34 | Especifica a porta do servidor. Nota que se a porta já está sendo utilizada, a Vite tentará automaticamente o próxima porta disponível assim esta pode não ser a posta em o servidor termina ouvindo. 35 | 36 | **Exemplo:** 37 | 38 | ```js 39 | export default defineConfig({ 40 | server: { 41 | port: 3030 42 | }, 43 | preview: { 44 | port: 8080 45 | } 46 | }) 47 | ``` 48 | 49 | ## `preview.strictPort` {#preview-strictPort} 50 | 51 | - **Tipo:** `boolean` 52 | - **Predefinido como:** [`server.strictPort`](./server-options#server-strictport) 53 | 54 | Define para `true` para sair se a porta já estiver em uso, no lugar de tentar automaticamente a próxima porta disponível. 55 | 56 | ## `preview.https` {#preview-https} 57 | 58 | - **Tipo:** `https.ServerOptions` 59 | - **Predefinido como:** [`server.https`](./server-options#server-https) 60 | 61 | Ativa TLS + HTTP/2. Nota que isto despromove para TLS apenas quando a [opção `server.proxy`](./server-options#server-proxy) também for utiliza. 62 | 63 | O valor também pode ser um [objeto de opções](https://nodejs.org/api/https.html#https_https_createserver_options_requestlistener) passado para `https.createServer()`. 64 | 65 | ## `preview.open` {#preview-open} 66 | 67 | - **Tipo:** `boolean | string` 68 | - **Predefinido como:** [`server.open`](./server-options#server-open) 69 | 70 | Abre automaticamente no navegador na início do servidor. Quando o valor for uma sequência de caracteres, será utilizada como o nome do caminho da URL. Se quiseres abrir o servidor em um navegador especifico de tua escolha, podes definir a variável de ambiente `process.env.BROWSER` para (por exemplo, `firefox`). Tu também podes definir `process.env.BROWSER_ARGS` para passar argumentos adicionais (por exemplo, `--incognito`). 71 | 72 | `BROWSER` e `BROWSER_ARGS` também são variáveis de ambiente especiais que podes definir no ficheiro `.env` para configurá-lo. Consulte [o pacote `open`](https://github.com/sindresorhus/open#app) para mais detalhes. 73 | 74 | ## `preview.proxy` {#preview-proxy} 75 | 76 | - **Tipo:** `Record` 77 | - **Predefinido como:** [`server.proxy`](./server-options#server-proxy) 78 | 79 | Configura regras de delegação personalizadas para o servidor de pré-visualização. Espera um objeto de pares `{ chave: opções }`. Se a chave começar com `^`, será interpretada como uma `RegExp` (Expressão Regular). A opção `configure` pode ser utilizada para acessar a instância da delegação. 80 | 81 | Utiliza [`http-proxy`](https://github.com/http-party/node-http-proxy). Opções completas [aqui](https://github.com/http-party/node-http-proxy#options). 82 | 83 | ## `preview.cors` {#preview-cors} 84 | 85 | - **Tipo:** `boolean | CorsOptions` 86 | - **Predefinido como:** [`server.cors`](./server-options#server-cors) 87 | 88 | Configura a partilha de recursos entre origens (CORS) para o servidor de pré-visualização. 89 | 90 | Consultar [`server.cors`](./server-options#server-cors) por mais detalhes. 91 | 92 | ## `preview.headers` {#preview-headers} 93 | 94 | - **Tipo:** `OutgoingHttpHeaders` 95 | 96 | Especifica os cabeçalhos da resposta do servidor. 97 | -------------------------------------------------------------------------------- /docs/config/ssr-options.md: -------------------------------------------------------------------------------- 1 | # Opções da Interpretação do Lado do Servidor {#ssr-options} 2 | 3 | ## `ssr.external` {#ssr-external} 4 | 5 | - **Tipo:** `string[] | true` 6 | - **Relacionado aos:** [O Exterior da Interpretação do Lado do Servidor](/guide/ssr#ssr-externals) 7 | 8 | Exterioriza as dependências dadas e suas dependências transitivas para a interpretação do lado do servidor. Por padrão, todas as dependências são exteriorizadas exceto para dependências ligadas (para substituição de módulo instantânea). Se preferirmos exteriorizar a dependência ligada, podemos passar o seu nome a esta opção. 9 | 10 | Se `true`, todas as dependências, incluindo as dependências ligadas, são exteriorizadas. 11 | 12 | Nota que as dependências listadas explicitamente (usando o tipo `string[]`) sempre terão prioridade se também estiverem listadas em `ssr.noExternal` (usando qualquer tipo). 13 | 14 | ## `ssr.noExternal` {#ssr-noexternal} 15 | 16 | - **Tipo:** `string | RegExp | (string | RegExp)[] | true` 17 | - **Relacionado aos:** [O Exterior da Interpretação do Lado do Servidor](/guide/ssr#ssr-externals) 18 | 19 | Impedi as dependências listadas de serem exteriorizadas para interpretação do lado do servidor, que serão empacotadas na construção. Por padrão, apenas as dependências ligadas não são exteriorizadas (para substituição de módulo instantânea). Se preferirmos exteriorizar a dependência ligada, podemos passar o seu nome à opção `ssr.external`. 20 | 21 | Se `true`, nenhuma dependência é exteriorizada. No entanto, dependências explicitamente listadas em `ssr.external` (usando o tipo `string[]`) podem ter prioridade e ainda assim serem exteriorizadas. Se `ssr.target: 'node'` for definida, os embutidos da Node.js também serão exteriorizados por padrão. 22 | 23 | Nota que se ambas `ssr.noExternal: true` e `ssr.external: true` forem configuradas, `ssr.noExternal` tem prioridade e nenhuma dependência é exteriorizada. 24 | 25 | ## `ssr.target` {#ssr-target} 26 | 27 | - **Tipo:** `'node' | 'webworker'` 28 | - **Predefinido como:** `node` 29 | 30 | Alvo da construção para o servidor da interpretação do lado do servidor. 31 | 32 | ## `ssr.resolve.conditions` {#srr-resolve-conditions} 33 | 34 | - **Tipo:** `string[]` 35 | - **Predefinida como:** `['module', 'node', 'development|production']` (`defaultServerConditions`) (`['module', 'browser', 'development|production']` (`defaultClientConditions`) para `ssr.target === 'webworker'`) 36 | - **Relacionada às:** [Condições de Resolução](./shared-options#resolve-conditions) 37 | 38 | 39 | Estas condições são usadas na conduta de extensão, e apenas afetam as dependências que não são exteriorizadas durante a construção de aplicações interpretadas do lado do servidor. Usamos `ssr.resolve.externalConditions` para afetar as importações exteriorizadas. 40 | 41 | ## `ssr.resolve.externalConditions` {#ssr-resolve-externalconditions} 42 | 43 | - **Tipo:** `string[]` 44 | - **Predefinida como:** `['node']` 45 | 46 | Condições usadas durante a importação da aplicação interpretada do lado do servidor (incluindo `ssrLoadModule`) das dependências diretas exteriorizadas (dependências externas importadas pela Vite). 47 | 48 | :::tip DICA 49 | Quando usamos esta opção, devemos executar a Node com [opção `--conditions`](https://nodejs.org/docs/latest/api/cli.html#-c-condition---conditionscondition) com os mesmos valores em ambos desenvolvimento e construção para obtermos um comportamento consistente. 50 | 51 | Por exemplo, quando definimos `['node', 'custom']`, devemos executar `NODE_OPTIONS='--conditions custom' vite` em desenvolvimento e `NODE_OPTIONS="--conditions custom" node ./dist/server.js` depois da construção. 52 | ::: 53 | -------------------------------------------------------------------------------- /docs/config/worker-options.md: -------------------------------------------------------------------------------- 1 | # Opções do Operário {#worker-options} 2 | 3 | Opções relacionadas aos Operários da Web. 4 | 5 | ## `worker.format` {#worker-format} 6 | 7 | - **Tipo:** `'es' | 'iife'` 8 | - **Predefinido como:** `iife` 9 | 10 | Formato de saída para o pacote do operário. 11 | 12 | ## `worker.plugins` {#worker-plugins} 13 | 14 | - **Tipo:** [`() => (Plugin | Plugin[])[]`](./shared-options#plugins) 15 | 16 | As extensões de Vite que aplicam-se ao pacote do operário. Nota que a [`config.plugins`](./shared-options#plugins) apenas aplica-se aos operários em desenvolvimento, deve ser configurado cá em vez de ser para a construção. A função deve retornar novas instâncias da extensão, uma vez que são usadas nas construções do operário da Rollup em paralelo. Então, a modificação das opções do `config.worker` no gatilho `config` não será ignorado. 17 | 18 | ## `worker.rollupOptions` {#worker-rollupoptions} 19 | 20 | - **Tipo:** [`RollupOptions`](https://rollupjs.org/configuration-options/) 21 | 22 | Opções de Rollup para construir o pacote do operário. 23 | -------------------------------------------------------------------------------- /docs/guide/comparisons.md: -------------------------------------------------------------------------------- 1 | # Comparações {#comparisons} 2 | 3 | ## WMR {#wmr} 4 | 5 | A [WMR](https://github.com/preactjs/wmr) criada pela equipa da Preact fornece um conjunto de funcionalidade semelhante, e o suporte da Vite 2.0 para a interface de extensão da Rollup é inspirada por ela. 6 | 7 | A WMR é desenhada principalmente para projetos de [Preact](https://preactjs.com/), e oferece mais funcionalidades integradas tais como a pré-interpretação. Em termos de escopo, está mais perto de uma meta abstração de Preact, com a mesma ênfase no tamanho compacto conforme a própria Preact. Se estiveres utilizando a Preact, a WMR é a que provavelmente oferecerá uma experiência mais refinada. 8 | 9 | ## @web/dev-server {#web-dev-server} 10 | 11 | O [@web/dev-server](https://modern-web.dev/docs/dev-server/overview/) (anteriormente `es-dev-server`) é um grande projeto e a configuração de servidor baseada na Koa da Vite 1.0 foi inspirada por ele. 12 | 13 | O `@web/dev-server` é um pouco de baixo nível em termos de escopo. Ele não fornece integrações de abstração oficiais, e exige que se defina manualmente uma configuração de Rollup para a construção de produção. 14 | 15 | No geral, a Vite é uma ferramenta mais opiniosa de alto nível que tem por objetivo fornecer um fluxo de trabalho mais fora da caixa. Com isto dito, o projeto aglutinador da `@web` contém várias outras ferramentas excelentes que também podem beneficiar os utilizadores de Vite. 16 | 17 | ## Snowpack {#snowpack} 18 | 19 | A [Snowpack](https://www.snowpack.dev/) também foi um servidor de desenvolvimento de ECMAScript nativo sem empacotamento, muito semelhante em escopo a Vite. O projeto não está mais sendo mantido. A equipa da Snowpack está agora trabalhando sobre a [Astro](https://astro.build/), um construtor de sítio estático alimentado pela Vite. 20 | 21 | À parte dos diferentes detalhes de implementação, os dois projetos partilharam muito em termos de vantagens técnicas sobre ferramental tradicional. A dependência da Vite de pré-empacotamento também é inspirada pela Snowpack v1 (agora [`esinstall`](https://github.com/snowpackjs/snowpack/tree/main/esinstall)). Algumas das principais diferenças entre os dois projetos estão listadas no [Guia de Comparações da Versão 2](https://v2.vite.dev/guide/comparisons). 22 | -------------------------------------------------------------------------------- /docs/guide/philosophy.md: -------------------------------------------------------------------------------- 1 | # Filosofia do Projeto {#project-philosophy} 2 | 3 | ## Núcleo Extensível Simples {#lean-extendable-core} 4 | 5 | A Vite não tenciona cobrir todo caso de uso para todos os utilizadores. A Vite tem por objetivo suportar os padrões mais comuns para construir aplicações de Web fora da caixa, mas o [núcleo da Vite](https://github.com/vitejs/vite) deve permanecer simples com uma superfície de API pequena para manter o projeto sustentável a longo prazo. Este objetivo é possível graças ao [sistema de extensão baseado na rollup da Vite](./api-plugin.md). Funcionalidades que podem ser implementadas como extensões externas normalmente não serão adicionadas ao núcleo da Vite. [vite-plugin-pwa](https://vite-pwa-org.netlify.app/) é um excelente exemplo do que pode ser alcançado fora do núcleo da Vite, existem muitas [extensões bem mantidas](https://github.com/vitejs/awesome-vite#plugins) para cobrir as tuas necessidades. A Vite trabalha em estreita colaboração com o projeto Rollup para garantir que as extensões podem ser usadas em ambos projetos de Rollup simples e Vite o máximo possível, tentando empurrar extensões necessárias para a API de Extensão a montante, sempre que possível. 6 | 7 | ## Empurrando a Web Moderna {#pushing-the-modern-web} 8 | 9 | A Vite fornece funcionalidades opiniosas que empurram a escrita de código moderno. Por exemplo: 10 | 11 | - O código-fonte apenas pode ser escrito em Módulo de ECMAScript, onde dependências que não usam Módulo de ECMAScript precisam ser [pré-empacotados como Módulo de ECMAScript](./dep-pre-bundling) para funcionarem. 12 | - Os operários da Web são encorajados a ser escritos com a [sintaxe `new Worker`](./features#web-workers) para seguirem os padrões modernos. 13 | - Os módulos da Node.js não podem ser usados no navegador. 14 | 15 | Quando adicionas novas funcionalidades, estes padrões são seguidos para criar uma API preparada para o futuro, o que pode nem sempre ser compatível com outras ferramentas de construção. 16 | 17 | ## Uma Abordagem Pragmática do Desempenho {#a-pragmatic-approach-to-performance} 18 | 19 | A Vite tem estado concentrada no desempenho desde as suas [origens](./why.md). A sua arquitetura de servidor de desenvolvimento permite a substituição de módulo instantânea que permanence rápida à medida que os projetos crescem. A Vite usa ferramentas nativas como [esbuild](https://esbuild.github.io/) e [SWC](https://github.com/vitejs/vite-plugin-react-swc) para implementar tarefas intensas mas mantém o resto do código em JavaScript para equilibrar a velocidade com a flexibilidade. Quando necessário, extensões de abstração explorarão a [Babel](https://babeljs.io/) para compilar o código do utilizador. E durante o tempo de construção a Vite atualmente usa [Rollup](https://rollupjs.org/) onde o tamanho do pacote e ter acesso à um ecossistema vasto de extensões forem mais importantes do que velocidade pura. A Vite continuará a evoluir internamente, usando novas bibliotecas a medida que aparecerem para melhor a experiência de programação enquanto mantém a sua API estável. 20 | 21 | ## Construindo Abstrações Sobre a Vite {#building-frameworks-on-top-of-vite} 22 | 23 | Embora a Vite possa ser usada pelos utilizadores diretamente, brilha como uma ferramenta para criar abstrações. O núcleo da Vite é agnóstica em relação a abstração, mas existem extensões polidas para cada abstração de interface de utilizador. Sua [API de JavaScript](./api-javascript) permite que os autores de abstração de aplicação usem funcionalidades da Vite para criar experiências personalizadas para os seus utilizadores. A Vite inclui suporte para [primitivos de Interpretação no Lado do Servidor](./ssr), normalmente presente em ferramentas de alto nível mas fundamental para construção de abstrações de Web modernas. E as extensões de Vite completam a imagem oferecendo uma maneira de partilhar entre abstrações. A Vite é também uma excelente ajuste quando pareada com [Abstrações de Backend](./backend-integration) como [Ruby](https://vite-ruby.netlify.app/) e [Laravel](https://laravel.com/docs/10.x/vite). 24 | 25 | ## Um Ecossistema Ativo {#an-active-ecosystem} 26 | 27 | A evolução da Vite é uma cooperação entre abstração e responsáveis pela manutenção de extensão, utilizadores, e a equipa da Vite. Nós encorajamos a participação ativa no desenvolvimento do núcleo da Vite assim que um projeto adotar a Vite. Nós trabalhamos em estreita colaboração com os principais projetos no ecossistema para minimizar regressões em cada lançamento, auxiliados por ferramentas como [vite-ecosystem-ci](https://github.com/vitejs/vite-ecosystem-ci). Ela permite-nos executar a integração contínua da maioria dos projetos usando a Vite nos pedidos de atualização do repositório selecionados e dá-nos um estado mais claro de como o ecossistema reagiria à um lançamento. Nós esforçamos-nos para corrigir as regressões antes delas atingirem os utilizadores e permitir que os projetos atualizem para as próximas versões assim que forem lançados. Se estiveres a trabalhar com a Vite, convidamos-te a juntares-te a [Discord da Vite](https://chat.vite.dev) e a participar no projeto também. 28 | -------------------------------------------------------------------------------- /docs/guide/using-plugins.md: -------------------------------------------------------------------------------- 1 | # Usando Extensões {#using-plugins} 2 | 3 | A Vite pode ser estendida usando extensões, que são baseadas na interface de extensão bem desenhadas da Rollup com algumas opções adicionais específicas para Vite. Isto significa que os utilizadores da Vite podem confiar no ecossistema maduro de extensões de Rollup, enquanto também são capazes de estender o servidor de desenvolvimento e a funcionalidade da interpretação do lado do servidor conforme necessário. 4 | 5 | ## Adicionando uma Extensão {#adding-a-plugin} 6 | 7 | Para usar uma extensão, esta precisa ser adicionada à `devDependencies` do projeto e incluída no vetor de `plugins` no ficheiro de configuração `vite.config.js`. Por exemplo, para fornecer suporte aos navegadores antigos, o pacote [`@vitejs/plugin-legacy`](https://github.com/vitejs/vite/tree/main/packages/plugin-legacy) oficial pode ser usado: 8 | 9 | ```sh 10 | $ npm add -D @vitejs/plugin-legacy 11 | ``` 12 | 13 | ```js twoslash [vite.config.js] 14 | import legacy from '@vitejs/plugin-legacy' 15 | import { defineConfig } from 'vite' 16 | 17 | export default defineConfig({ 18 | plugins: [ 19 | legacy({ 20 | targets: ['defaults', 'not IE 11'], 21 | }), 22 | ], 23 | }) 24 | ``` 25 | 26 | O `plugins` também aceita predefinições incluindo várias extensões como um único elemento. Isto é útil para funcionalidades complexas (como integração de abstração) que são implementadas usando várias extensões. O vetor será simplificado (ou aplanado) internamente. 27 | 28 | As extensões falsas serão ignoradas, as quais podem ser usadas para ativar e desativar facilmente as extensões. 29 | 30 | ## Encontrando Extensões {#finding-plugins} 31 | 32 | :::tip NOTA 33 | A Vite tem por objetivo fornecer suporte fora da caixa para os padrões de desenvolvimento da Web comuns. Antes de procurarmos por uma extensão compatível com a Vite ou com a Rollup, devemos consultar o [Guia de Funcionalidades](../guide/features). Muitos casos onde uma extensão seria necessária num projeto de Rollup já são cobertos pela Vite. 34 | ::: 35 | 36 | Consulte a [secção de Extensões](../plugins/) por informação sobre a extensões oficiais. As extensões da comunidade são listadas no [`awesome-vite`](https://github.com/vitejs/awesome-vite#plugins). 37 | 38 | Nós também podemos encontrar extensões que seguem as [convenções recomendadas](./api-plugin#conventions) usando um [`npm search` por `vite-plugin`](https://www.npmjs.com/search?q=vite-plugin&ranking=popularity) para extensões de Vite ou um [`npm search` por `rollup-plugin`](https://www.npmjs.com/search?q=rollup-plugin&ranking=popularity) para extensões de Rollup. 39 | 40 | ## Forçando o Ordenamento de Extensão {#enforcing-plugin-ordering} 41 | 42 | Para compatibilidade com algumas extensões de Rollup, pode ser necessário forçar a ordem da extensão ou apenas aplicar durante a construção. Isto deve ser um detalhe de implementação para extensões de Vite. Nós podemos forçar a posição duma extensão com o modificador `enforce`: 43 | 44 | - `pre`: invoca a extensão antes das extensões principais da Vite 45 | - `default`: invoca a extensão depois das extensões principais da Vite 46 | - `post`: invoca a extensão depois das extensões de construção da Vite 47 | 48 | ```js twoslash [vite.config.js] 49 | import image from '@rollup/plugin-image' 50 | import { defineConfig } from 'vite' 51 | 52 | export default defineConfig({ 53 | plugins: [ 54 | { 55 | ...image(), 56 | enforce: 'pre', 57 | }, 58 | ], 59 | }) 60 | ``` 61 | 62 | Consulte o [Guia da API de Extensões](./api-plugin.md#plugin-ordering) por informação detalhada. 63 | 64 | ## Aplicação Condicional {#conditional-application} 65 | 66 | Por padrão, as extensões são invocadas por ambos comandos `serve` e `build`. Nos casos onde uma extensão precisa ser condicionalmente aplicada apenas durante a execução do comando `serve` ou `build`, usamos a propriedade `apply` para apenas invocá-las durante o `'build'` ou `'serve'`; 67 | 68 | ```js twoslash [vite.config.js] 69 | import typescript2 from 'rollup-plugin-typescript2' 70 | import { defineConfig } from 'vite' 71 | 72 | export default defineConfig({ 73 | plugins: [ 74 | { 75 | ...typescript2(), 76 | apply: 'build', 77 | }, 78 | ], 79 | }) 80 | ``` 81 | 82 | ## Construindo Extensões {#building-plugins} 83 | 84 | Consultar o [Guia da API de Extensões](./api-plugin) pela documentação sobre a criação de extensões. 85 | -------------------------------------------------------------------------------- /docs/images/bundler.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | Pacote baseado no servidor de desenvolvimento 4 | 5 | 6 | 7 | 9 | entrada 10 | 11 | 12 | 14 | ··· 15 | 16 | 17 | 19 | rota 20 | 21 | 22 | 24 | rota 25 | 26 | 29 | 30 | 33 | 36 | 39 | 42 | 45 | 48 | 51 | 52 | 54 | módulo 55 | 56 | 57 | 59 | módulo 60 | 61 | 62 | 64 | módulo 65 | 66 | 67 | 69 | módulo 70 | 71 | 72 | 74 | ··· 75 | 76 | 77 | 78 | 79 | 81 | Pacote 82 | 83 | 84 | 86 | Servidor 87 | Pronto 88 | 89 | 90 | -------------------------------------------------------------------------------- /docs/images/community/placeholder.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/community/placeholder.jpg -------------------------------------------------------------------------------- /docs/images/diagrams.fig: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/diagrams.fig -------------------------------------------------------------------------------- /docs/images/graph.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 5 | Entrada 6 | 7 | 8 | 10 | pedaço A assíncrono 11 | 12 | 13 | 15 | pedaço C comum 16 | 17 | 18 | 20 | pedaço B assíncrono 21 | 22 | 25 | 28 | 30 | importação dinâmica 31 | 32 | 34 | importação direta 35 | 36 | 39 | 42 | 43 | -------------------------------------------------------------------------------- /docs/images/lit.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/images/preact.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/images/react.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/images/svelte.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/images/v3-docs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/v3-docs.png -------------------------------------------------------------------------------- /docs/images/v3-new-open-issues-and-PRs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/v3-new-open-issues-and-PRs.png -------------------------------------------------------------------------------- /docs/images/v3-open-issues-and-PRs.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/v3-open-issues-and-PRs.png -------------------------------------------------------------------------------- /docs/images/vercel-configuration.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/vercel-configuration.png -------------------------------------------------------------------------------- /docs/images/vite-plugin-inspect.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/images/vite-plugin-inspect.png -------------------------------------------------------------------------------- /docs/images/vite.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /docs/images/vue.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Vite 3 | titleTemplate: Ferramentas de Frontend Modernas 4 | pageClass: landing dark 5 | 6 | layout: home 7 | aside: false 8 | editLink: false 9 | markdownStyles: false 10 | --- 11 | 12 | 28 | 29 |
30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 |
48 | -------------------------------------------------------------------------------- /docs/plugins/index.md: -------------------------------------------------------------------------------- 1 | # Extensões {#plugins} 2 | 3 | :::tip NOTA 4 | A Vite tem por objetivo fornecer suporte fora da caixa para os padrões de desenvolvimento da Web comuns. Antes de procurar por uma extensão compatível com a Vite ou Rollup, consulte o [Guia de Funcionalidades](../guide/features). Muitos casos onde uma extensão seria necessária num projeto de Rollup já são cobertos na Vite. 5 | ::: 6 | 7 | Consulte o guia [Usando Extensões](../guide/using-plugins) por informações a respeito de como usar as extensões. 8 | 9 | ## Extensões Oficiais {#official-plugins} 10 | 11 | ### [`@vitejs/plugin-vue`](https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue) 12 | 13 | - Fornece suporte para Componentes de Ficheiro Único da Vue 3 14 | 15 | ### [`@vitejs/plugin-vue-jsx`](https://github.com/vitejs/vite-plugin-vue/tree/main/packages/plugin-vue-jsx) 16 | 17 | - Fornece suporte de JSX da Vue 3 (através da [transformação da Babel dedicada](https://github.com/vuejs/jsx-next)). 18 | 19 | ### [`@vitejs/plugin-vue2`](https://github.com/vitejs/vite-plugin-vue2) 20 | 21 | - Fornece suporta aos Componentes de Ficheiro Único da Vue 2.7. 22 | 23 | ### [`@vitejs/plugin-vue2-jsx`](https://github.com/vitejs/vite-plugin-vue2-jsx) 24 | 25 | - Fornece suporte de JSX da Vue 2.7 (através da [transformação da Babel dedicada](https://github.com/vuejs/jsx-vue2/)). 26 | 27 | ### [`@vitejs/plugin-react`](https://github.com/vitejs/vite-plugin-react/tree/main/packages/plugin-react) 28 | 29 | - Usa a `esbuild` e a Babel, alcançando a rápida substituição de módulo instantânea com uma pequena pegada de pacote e a flexibilidade de ser capaz de usar a conduta de transformação da Babel. Sem as extensões adicionais da Babel, apenas a `esbuild` é usada durante as construções. 30 | 31 | ### [`@vitejs/plugin-react-swc`](https://github.com/vitejs/vite-plugin-react-swc) 32 | 33 | - Substitui a Babel pela SWC durante o desenvolvimento. Durante as construções, a SWC e a `esbuild` são usadas quando usamos extensões, de outro modo apenas a `esbuild` é usada. Para projetos grandes não exigem extensões de React não-padronizadas, o arranque refrigerado e a substituição de módulo instantânea podem ser significativamente mais rápidos. 34 | 35 | ### [`@vitejs/plugin-legacy`](https://github.com/vitejs/vite/tree/main/packages/plugin-legacy) 36 | 37 | - Fornece suporte de navegadores legados para a construção de produção. 38 | 39 | ## Extensões da Comunidade {#community-plugins} 40 | 41 | Consulte a [`awesome-vite`](https://github.com/vitejs/awesome-vite#plugins) - também podemos submeter um pedido de atualização de repositório (ou PR) para listar as nossas extensões dentro do repositório. 42 | 43 | ## Extensões de Rollup {#rollup-plugins} 44 | 45 | As [extensões da Vite](../guide/api-plugin) são uma extensão da interface de extensão da Rollup. Consulte a [seção de Compatibilidade de Extensão de Rollup](../guide/api-plugin#rollup-plugin-compatibility) por mais informações. 46 | -------------------------------------------------------------------------------- /docs/public/_headers: -------------------------------------------------------------------------------- 1 | /assets/* 2 | cache-control: max-age=31536000 3 | cache-control: immutable 4 | 5 | /*.svg 6 | cache-control: max-age=604800 7 | cache-control: immutable 8 | 9 | /*.png 10 | cache-control: max-age=604800 11 | cache-control: immutable 12 | -------------------------------------------------------------------------------- /docs/public/_redirects: -------------------------------------------------------------------------------- 1 | # temporary, we'll flip this around some day 2 | https://vitejs.dev/* https://vite.dev/:splat 301! 3 | https://pt.vitejs.dev/* https://pt.vite.dev/:splat 301! 4 | 5 | /guide/api-vite-runtime /guide/api-environment 302 6 | /guide/api-vite-runtime.html /guide/api-environment 302 7 | /guide/api-vite-environment /guide/api-environment 302 8 | /guide/api-vite-environment.html /guide/api-environment 302 9 | -------------------------------------------------------------------------------- /docs/public/astro.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/public/ecosystem-vite4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/ecosystem-vite4.png -------------------------------------------------------------------------------- /docs/public/github.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /docs/public/logo-home.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 | 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 | 41 | 42 | 43 | 44 | 45 | 46 | 47 | -------------------------------------------------------------------------------- /docs/public/logo-uwu.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/logo-uwu.png -------------------------------------------------------------------------------- /docs/public/logo-with-shadow.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/logo-with-shadow.png -------------------------------------------------------------------------------- /docs/public/logo.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | -------------------------------------------------------------------------------- /docs/public/noise.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/noise.png -------------------------------------------------------------------------------- /docs/public/nuxtlabs.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/public/og-image-announcing-vite3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image-announcing-vite3.png -------------------------------------------------------------------------------- /docs/public/og-image-announcing-vite4-3.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image-announcing-vite4-3.png -------------------------------------------------------------------------------- /docs/public/og-image-announcing-vite4.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image-announcing-vite4.png -------------------------------------------------------------------------------- /docs/public/og-image-announcing-vite5-1.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image-announcing-vite5-1.png -------------------------------------------------------------------------------- /docs/public/og-image-announcing-vite5.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image-announcing-vite5.png -------------------------------------------------------------------------------- /docs/public/og-image-announcing-vite6.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image-announcing-vite6.png -------------------------------------------------------------------------------- /docs/public/og-image.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/og-image.jpg -------------------------------------------------------------------------------- /docs/public/stackblitz.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /docs/public/vite.mp3: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/vite.mp3 -------------------------------------------------------------------------------- /docs/public/vite4-3-hmr-time.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/vite4-3-hmr-time.png -------------------------------------------------------------------------------- /docs/public/vite4-3-startup-time.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/vite4-3-startup-time.png -------------------------------------------------------------------------------- /docs/public/vite5-1-10K-modules-loading-time.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/vite5-1-10K-modules-loading-time.png -------------------------------------------------------------------------------- /docs/public/vite6-npm-weekly-downloads.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/vitejs/docs-pt/7c1f456ba09ab9a08ad391da743c771f959ae0a0/docs/public/vite6-npm-weekly-downloads.png -------------------------------------------------------------------------------- /docs/public/voice.svg: -------------------------------------------------------------------------------- 1 | 7 | -------------------------------------------------------------------------------- /docs/public/voidzero.svg: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /docs/releases.md: -------------------------------------------------------------------------------- 1 | # Lançamentos {#releases} 2 | 3 | Os lançamentos da Vite seguem o [Padrão de Definição de Versão Semântica](https://semver.org/). Podemos ver a versão estável mais recente da Vite na [página do pacote de npm da Vite](https://www.npmjs.com/package/vite). 4 | 5 | Um relatório completo de mudanças dos lançamentos passados encontra-se [disponível na GitHub](https://github.com/vitejs/vite/blob/main/packages/vite/CHANGELOG.md). 6 | 7 | ## Ciclo de Lançamento {#release-cycle} 8 | 9 | A Vite não tem um ciclo de lançamento fixo. 10 | 11 | - **Remendo**: estes lançamentos são realizados quando necessário (normalmente todas as semanas). 12 | - **Secundários**: estes lançamentos sempre contêm novas funcionalidades e também são realizados quando necessários. Os lançamentos secundários sempre terão uma fase de pré-lançamento beta (normalmente todos os meses). 13 | - **Principais**: estes lançamentos geralmente alinham-se com a [agenda do FIM DA VIDA da Node.js](https://endoflife.date/nodejs), e serão anunciados com antecedência. Estes lançamentos passaram por discussões de longo prazo com o ecossistema, e terão fases de pré-lançamentos alfa e beta (normalmente todos os anos). 14 | 15 | Os intervalos de versões da Vite que são suportados pela equipa da Vite são automaticamente determinados por: 16 | 17 | - Pela **atual versão secundária** que recebe correções regulares. 18 | - Pela **anterior versão primária** (apenas para suas versões secundárias mais recentes) e a **anterior versão secundária** que recebem correções e remendos de segurança importantes. 19 | - Pela **penúltima versão primária** (apenas para suas versões secundárias mais recentes) e a **penúltima versão secundária** que recebem remendos de segurança. 20 | - Todas as versões anteriores a estas já não são suportadas. 21 | 22 | Como um exemplo, se a versão mais recente da Vite estiver na 5.3.10: 23 | 24 | - Os remendos regulares são lançados por `vite@5.3`. 25 | - As correções e remendos de segurança importantes são aplicados a `vite@4` e `vite@5.2`. 26 | - Os remendos de segurança também são aplicados a `vite@3`, e `vite@5.1`. 27 | - A `vite@2` e `vite@5.0` já não são suportados. Os utilizadores devem atualizar para receberem atualizações. 28 | 29 | Recomendamos atualizar a Vite regularmente. Podemos consultar o [Guia de Migração](/guide/migration) quando atualizarmos para cada versão primária. A equipa da Vite trabalha em estreita colaboração com os principais projetos do ecossistema para garantir a qualidade das novas versões. Testamos as novas versões da Vite antes de as lançarmos através do projeto [`vite-ecosystem-ci`](https://github.com/vitejs/vite-ecosystem-ci). A maioria dos projetos que utilizam a Vite devem ser capazes de oferecer rapidamente suporte ou migrar para novas versões assim que estas forem lançadas. 30 | 31 | ## Casos Extremos do Padrão da Definição de Versão Semântica {#semantic-versioning-edge-cases} 32 | 33 | ### Definições de TypeScript {#typescript-definitions} 34 | 35 | Nós podemos entregar mudanças incompatíveis às definições de TypeScript entre versões secundárias. Isto porque: 36 | 37 | - Algumas vezes a própria TypeScript entrega mudanças incompatíveis entre versões secundárias, e podemos ter de ajustar os tipos para suportarem as versões mais recentes da TypeScript. 38 | - Ocasionalmente podemos precisar de adotar as funcionalidades que apenas estão disponíveis numa versão mais recente da TypeScript, aumentando a versão obrigatória mínima da TypeScript. 39 | - Se estivermos a usar a TypeScript, podemos usar um limite do padrão de definição de versão semântica que fecha a versão secundária atual e atualizar manualmente quando uma nova versão secundária da Vite for lançada. 40 | 41 | ### `esbuild` {#esbuild} 42 | 43 | A [`esbuild`](https://esbuild.github.io/) está na versão pré-1.0.0 e algumas vezes tem uma mudança de rutura que podemos precisar de incluir para ter acesso às funcionalidades mais recentes e melhorias do desempenho. Nós podemos bater a versão da `esbuild` numa versão secundária da Vite. 44 | 45 | ### Versões Que Não Fazem Parte do Suporte de Longo Prazo da Node.js {#node-js-non-lts-versions} 46 | 47 | As versões que não fazem parte do suporte de longo prazo da Node.js (versões numeradas com ímpares) não são testas como parte da integração continua da Vite, mas devem continuar a funcionar antes do [FIM DA SUA EXPECTATIVA DE VIDA](https://endoflife.date/nodejs). 48 | 49 | ## Pré-Lançamentos {#pre-releases} 50 | 51 | Os lançamentos secundários normalmente passam por um número não fixo de lançamentos beta. Os lançamentos principais passarão por uma fase alfa e uma fase beta. 52 | 53 | Os pré-lançamentos permitem que os primeiros adotantes e responsáveis do ecossistema fazerem a integração e testes de estabilidade, e fornecer comentários. Não use os pré-lançamentos em produção. Todos os pré-lançamentos são considerados instáveis e podem entregar mudanças de rutura no meio. Sempre devemos colocar as versões exatas quando usamos pré-lançamentos. 54 | 55 | ## Depreciações {#deprecations} 56 | 57 | Nós depreciamos periodicamente funcionalidades que tem sido substituídas por alternativas melhores nos lançamentos secundários. As funcionalidades depreciadas continuarão a funcionar com um aviso de tipo ou um aviso registado. Elas serão removidas no próximo lançamento primário depois de entrarem no estado de depreciado. O [Guia de Migração](/guide/migration) para cada lançamento primário listará estas remoções e documentará um caminho de atualização para as mesmas. 58 | 59 | ## Funcionalidades Experimentais {#experimental-features} 60 | 61 | Algumas funcionalidades são marcadas como experimentais quando lançadas numa versão estável da Vite. As funcionalidades experimentais permitem-nos reunir a experiência no mundo real para influenciar o seu desenho final. O objetivo é permitir que os utilizadores forneçam comentários testando-as em produção. As próprias funcionalidades experimentais são consideradas instáveis, e apenas deveriam ser usadas duma maneira controlada. Estas funcionalidades podem mudar entre versões secundárias, então os utilizadores devem fixar suas versões da Vite quando dependem delas. Nós criaremos [uma discussão da GitHub](https://github.com/vitejs/vite/discussions/categories/feedback?discussions_q=is%3Aopen+label%3Aexperimental+category%3AFeedback) para cada funcionalidade experimental. 62 | -------------------------------------------------------------------------------- /docs/team.md: -------------------------------------------------------------------------------- 1 | --- 2 | layout: page 3 | title: Equipa 4 | description: O desenvolvimento da Vite é orientado por uma equipa internacional. 5 | --- 6 | 7 | 16 | 17 | 18 | 19 | 20 | 23 | 24 | 25 | 26 | 27 | 30 | 33 | 34 | 35 | -------------------------------------------------------------------------------- /netlify.toml: -------------------------------------------------------------------------------- 1 | [build.environment] 2 | NODE_VERSION = "20" 3 | # don't need playwright for docs build 4 | PLAYWRIGHT_SKIP_BROWSER_DOWNLOAD = "1" 5 | [build] 6 | publish = "docs/.vitepress/dist" 7 | command = "pnpm run build" 8 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vite-docs-pt", 3 | "version": "5.4.0", 4 | "description": "Documentação Oficial da Vite em Português", 5 | "type": "module", 6 | "main": "docs/index.md", 7 | "directories": { 8 | "doc": "docs" 9 | }, 10 | "scripts": { 11 | "dev": "vitepress dev docs", 12 | "build": "vitepress build docs", 13 | "serve": "vitepress serve docs" 14 | }, 15 | "repository": { 16 | "type": "git", 17 | "url": "git+https://github.com/vitejs/docs-pt.git" 18 | }, 19 | "keywords": [ 20 | "vite", 21 | "docs", 22 | "portuguese", 23 | "translation", 24 | "pt.vite.dev", 25 | "br.vite.dev" 26 | ], 27 | "author": { 28 | "name": "Nazaré da Piedade", 29 | "email": "nazarepiedady@gmail.com", 30 | "url": "https://github.com/nazarepiedady" 31 | }, 32 | "license": "MIT", 33 | "bugs": { 34 | "url": "https://github.com/vitejs/docs-pt/issues" 35 | }, 36 | "homepage": "https://github.com/vitejs/docs-pt#readme", 37 | "pnpm": { 38 | "peerDependencyRules": { 39 | "allowedVersions": { 40 | "react": "18" 41 | } 42 | } 43 | }, 44 | "dependencies": { 45 | "search-insights": "^2.17.3", 46 | "vite": "^6.3.4" 47 | }, 48 | "devDependencies": { 49 | "@algolia/client-search": "^5.20.3", 50 | "@shikijs/vitepress-twoslash": "^3.1.0", 51 | "@types/express": "^5.0.0", 52 | "@types/node": "22.15.29", 53 | "@types/react": "^19.0.10", 54 | "feed": "^5.0.0", 55 | "gsap": "^3.12.7", 56 | "react": "^19.0.0", 57 | "react-dom": "^19.0.0", 58 | "vitepress": "^1.6.3", 59 | "vitepress-plugin-group-icons": "^1.3.6", 60 | "vue": "^3.5.13" 61 | }, 62 | "packageManager": "pnpm@10.11.1+sha512.e519b9f7639869dc8d5c3c5dfef73b3f091094b0a006d7317353c72b124e80e1afd429732e28705ad6bfa1ee879c1fce46c128ccebd3192101f43dd67c667912" 63 | } 64 | -------------------------------------------------------------------------------- /renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://docs.renovatebot.com/renovate-schema.json", 3 | "extends": [ 4 | "config:recommended" 5 | ] 6 | } 7 | --------------------------------------------------------------------------------