Огромный список Vite плагинов

Vite плагин может быть просто удобной утилитой, которая делает что-то полезное во время сборки. Легко пишется самому, и необязательно его публиковать через NPM, чтобы использовать в своем проекте. Может быть просто частью проекта.

#vite

Чтобы заставить Vite HMR перегружаться при изменении конкретных файлов, иногда может понадобиться такой плагин:

// vite.config.ts

const fullReloadJson5 = {
  name: "full-reload-json5",
  handleHotUpdate({ file, server }) {
    if (file.endsWith(".json5")) {
      server.ws.send({ type: "full-reload" });
    }
    return [];
  },
};

// ...
plugins: [
    vue(),
    json5Plugin(),
    fullReloadJson5,
  ],

#vite #tip

В мой vite-plugin-html-injection сделали первый PR

Приятно, чёрт возьми.

Теперь во фрагментах можно использовать Vite env переменные, типа %VITE_API_URL%, которые будут заменены на их значения.

#vite #plugin #lib

Rolldown-Vite готовится

Эван обещал в течение 2-3 месяцев

#rolldown #vite

Я ранее советовал переходить от .env к конфигурационным файлам в json формате

Но нужно понимать, что переменные из .env заменяются в коде на этапе компиляции, а из конфига подставляются в райнтайме

Это значит блок кода

if (import.meta.env.MODE === "development") {
    // do some debug work
}

не попадет в бандл вообще в первом случае, а аналог с конфиг файлом - попадет, (но не будет выполняться, естественно).

Так что иногда имеет смысл использовать эту конструкцию (для import.meta.env.MODE переменной .env файл не нужен, она определена всегда).

#vite #tip

Для Vue проекта с микрофронтэндами человек детально сравнил три бандлера

https://habr.com/ru/articles/888478/

#vite #webpack #rspack

Хех... Эван прочел этот пост, но один "meta" все же лишний

Иначе Laravel - это мета-фреймворк над Symfony

#vite #evanyou

В последних версиях Vite активно доделывают поддержку lightningcss

Сейчас для процессинга CSS используется ESBuild, но с переходом на Rolldown нужно что-то другое.
Экспериментально lightningcss был в Vite с 4 версии.

#vite #css

В GitLab-e уже тестируют rolldown-vite

Скорость сборки примерно в 5 раз быстрей, и значительно меньше потребление памяти

#gitlab #rolldown #vite

Вышел Vite 7 beta.0, который готовят под Rolldown

Меж тем Vite с Rolldown можно уже использовать через опубликованный пару дней назад специальный форк Vite - rolldown-vite

Кто-то уже пробовал?

#vite #rolldown

Интересная статья / интервью Эвана про Vite и Vite+

Перевод

Оригинал

#vite #evanyou

Незаметно вышел Vite 7.0

Нового интересного мало. В основном убрали поддержку устаревшего.

А я поймал какой-то странный баг месяц назад и не могу от него избавиться.
При запуске dev сервера порт показывается 5173, но в браузере открывается 5176 и работает по 5176.
Пришлось менять в куче мест...

  VITE v7.0.0  ready in 336 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: http://192.168.1.101:5173/
  ➜  press h + enter to show help

#vite