Skip to content

Latest commit

 

History

History
71 lines (45 loc) · 3.97 KB

vite.md

File metadata and controls

71 lines (45 loc) · 3.97 KB

Установка и работа с Vite

Vite (с французского "быстрый", произносится /вит/) - это инструмент сборки, созданный для обеспечения быстрого и бережливого (lean) процесса разработки современных веб-проектов.

Шаг 1: Установка Vite

Для начала нужно убедиться, что у вас установлены Node.js версии >=12.0.0 и npm (или Yarn). Сделать это можно по инструкции Node.js.

  1. Откройте терминал или командную строку.
  2. Введите команду для создания нового проекта с помощью Vite:
npm create vite@latest
  1. Укажите имя вашего проекта и выберите фреймворк (например, React, Vue, Vanilla JS и т.д.):
✔ Project name: vite-project
✔ Select a framework: › React
✔ Select a variant: › TypeScript (если нужен TypeScript) или просто JavaScript

После выбора Vite создаст структуру проекта.

Шаг 2: Установка зависимостей

После создания проекта нужно установить зависимости:

cd vite-project
npm install

Шаг 3: Запуск проекта

Чтобы начать разработку, запустите команду:

npm run dev

После этого Vite запустит локальный сервер и откроет проект в браузере. По умолчанию сервер запускается на http://localhost:5173/.

Шаг 4: Настройка конфигурации

Конфигурационный файл Vite находится в корне проекта и называется vite.config.js (или vite.config.ts, если используется TypeScript). Он позволяет настраивать различные параметры проекта, например, алиасы, плагины, серверные настройки и прочее.

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

Подробнее про конфигурацию Vite можно прочитать на официальном сайте или в русской версии.

Шаг 5: Сборка проекта

Когда проект готов для публикации, вы можете собрать его с помощью команды:

npm run build

Vite создаст оптимизированные файлы для продакшена в папке dist.

Шаг 6: Запуск собранного проекта

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

npm run preview

Что дальше?

Этого достаточно, чтобы написать своё первое фронтенд-приложение с использованием Vite. Если остались вопросы, всегда можно обратиться к документации. Либо к русской версии.