Релиз Vite 8.1!

23 июня 2026 г.

Vite 8 был выпущен в марте с единым универсальным сборщиком на базе Rolldown, открыв путь для дальнейших улучшений. Сейчас он набирает 41,6 миллиона загрузок в неделю, почти достигнув общего числа загрузок Vite 7. Помимо устранения проблем, возникших при обновлении, мы работали над новыми возможностями и рады объявить о выпуске Vite 8.1.

Быстрые ссылки:

• Документация
• Переводы: 简体中文, 日本語, Español, Português, 한국어, Deutsch, فارسی
• Журнал изменений на GitHub

Попробуйте Vite 8.1 онлайн с помощью vite.new или создайте приложение Vite локально с использованием предпочитаемого фреймворка, выполнив pnpm create vite. Дополнительную информацию см. в руководстве по началу работы.

Мы приглашаем вас помочь сделать Vite ещё лучше (присоединившись к более чем 1,2 тыс. контрибьюторам ядра Vite), а также развивать наши зависимости, плагины и проекты экосистемы. Подробнее об этом можно узнать в нашем Руководстве по внесению вклада. Хороший способ начать — помогать с разбором новых задач, проверкой пулреквестов, отправлять PR с тестами по открытым задачам, а также помогать другим в Обсуждениях или на форуме поддержки сообщества Vite Land. Если у вас есть вопросы, присоединяйтесь к нашему сообществу в Discord и общайтесь с нами в канале #contributing.

Следите за новостями и общайтесь с другими разработчиками, использующими Vite, подписавшись на нас в Bluesky, X или Mastodon.

Возможности

Экспериментальный режим разработки со сборкой

Теперь доступна экспериментальная поддержка режима разработки со сборкой (bundled dev mode). Ранее этот режим назывался «Full Bundle Mode» («режим полной сборки»). Он предназначен для повышения производительности крупных приложений, где большое количество модулей становится узким местом.

В наших первых тестах на приложении, загружающем 10 000 React-компонентов, режим разработки со сборкой обеспечил примерно в 15 раз более быстрый запуск и в 10 раз более быструю полную перезагрузку страницы по сравнению с обычным несобранным dev-сервером, при этом HMR («горячая замена модулей») оставалась мгновенной независимо от размера приложения. Первые тесты на реальных проектах показывают аналогичный прирост: команда Linear отметила ускорение холодного запуска до 3 раз, сокращение времени полной перезагрузки примерно на 40% и уменьшение количества сетевых запросов в 10 раз.

Зачем нужен режим разработки со сборкой?

Vite известен своим подходом с несобранным dev-сервером, который стал одной из главных причин его скорости и популярности после появления проекта. Изначально этот подход был экспериментом, целью которого было проверить, насколько далеко можно продвинуться в повышении производительности сервера разработки без традиционной сборки.

Однако по мере роста размера и сложности проектов стало очевидно, что несобранный подход Vite может ухудшать производительность во время разработки. Поскольку каждый модуль загружается отдельно, браузеру приходится обрабатывать большое количество запросов, что увеличивает накладные расходы при запуске и обновлении страницы. Это особенно заметно в крупных приложениях и ещё сильнее проявляется, когда разработчики работают через сетевой прокси, приводя к более медленным обновлениям и ухудшению процесса разработки.

Режим разработки со сборкой позволяет отдавать собранные файлы не только в продакшене, но и во время разработки, объединяя преимущества обоих подходов:

• быстрый запуск даже для крупных приложений;
• снижение сетевых накладных расходов при обновлении страницы;
• сохранение эффективного HMR поверх ESM-вывода.

В настоящее время этот режим ориентирован на браузерную часть, базовые плагины и основные возможности. Если вы используете сторонний плагин, он может не работать в этом режиме. Если вы используете менее распространённую возможность Vite, она также может не поддерживаться. Мы работаем над расширением поддержки и готовим документацию, которая объяснит, какие изменения могут потребоваться со стороны плагинов. Подробнее о планах развития см. в документе с описанием архитектуры.

Чтобы включить этот режим, передайте флаг --experimental-bundle или добавьте experimental.bundledDev: true в файл vite.config.js:

vite.config.js

import { defineConfig } from 'vite'

export default defineConfig({
  experimental: {
    bundledDev: true,
  },
})

Поделитесь своими отзывами в обсуждении.

Экспериментальная карта импорта чанков

В итоговой сборке оператор импорта каждого чанка содержит хеш этого чанка. Это необходимо для того, чтобы при изменении содержимого чанка загружалась его новая версия. Однако из-за этого меняется не только хеш изменённого чанка. Изменяются и хеши чанков, которые ссылаются на него. Затем то же самое происходит со всеми чанками выше по цепочке зависимостей.

Экспериментальная функция карты импорта чанков решает эту проблему с помощью import maps и повышает эффективность кэширования. Эта функция построена на базе возможностей Rolldown, но добавляет поддержку специфичных для Vite возможностей. Большое спасибо Taisei Mima за исследование и первоначальную реализацию этой функции!

Обратите внимание, что experimental.renderBuiltUrl в настоящее время не работает при включении этой опции.

Подробнее см. в руководстве и в документации опции. Поделитесь своим мнением в обсуждении.

Поддержка интеграции Wasm ESM

Поддержка предложения об интеграции Wasm ESM теперь доступна в Vite. Теперь вы можете импортировать wasm-файлы и напрямую использовать экспортированные функции:

import { add } from './add.wasm'

console.log(add(1, 2)) // 3

Большое спасибо Menci за создание и поддержку vite-plugin-wasm на ранних этапах существования предложения, а также за внесение реализации в ядро Vite!

Подробнее см. в руководстве.

Ещё один шаг к использованию Lightning CSS по умолчанию

Мы совместно с командой Lightning CSS добавили возможности, которые ранее поддерживались PostCSS, но отсутствовали в Lightning CSS. В Vite 8.1 появились две новые возможности:

• Разрешение внешних CSS-файлов, импортируемых внутри CSS-файлов (lightningcss#479)
• Регистрация файловых зависимостей через плагины (lightningcss#877)

Мы рассматриваем возможность перехода на Lightning CSS как CSS-преобразователь по умолчанию в следующем мажорном релизе. Попробуйте его через css.transformer: 'lightningcss' и поделитесь своим мнением в обсуждении.

Регистронезависимое сопоставление в import.meta.glob

import.meta.glob теперь поддерживает опцию caseSensitive для регистронезависимого сопоставления файлов.

// matches ./dir/Module1.js
const modules = import.meta.glob('./dir/module*.js', {
  caseSensitive: false,
})

Обнаружение ресурсов для пользовательских HTML-элементов и атрибутов

Ранее Vite обнаруживал ресурсы только для заранее определённых элементов и атрибутов. Теперь можно использовать опцию html.additionalAssetSources, чтобы добавить дополнительные элементы и атрибуты.

<html-import src="./some/other/file.html"></html-import>
<img
  src="/layout-default.png"
  data-src-dark="/layout-dark.png"
  data-src-light="/layout-light.png"
/>

vite.config.js

import { defineConfig } from 'vite'

export default defineConfig({
  html: {
    additionalAssetSources: {
      'html-import': {
        srcAttributes: 'src',
      },
      img: {
        srcAttributes: ['data-src-dark', 'data-src-light'],
      },
    },
  },
})

Другие изменения

См. журнал изменений, чтобы узнать о других возможностях и исправлениях ошибок.

Благодарности

Vite 8.1 стал возможен благодаря нашему сообществу участников, сопровождающим проектов экосистемы и команде Vite. Разработка Vite ведётся компанией VoidZero в партнёрстве с Bolt и Nuxt Labs. Мы также хотим поблагодарить наших спонсоров на GitHub Sponsors Vite и Open Collective Vite.