Вы все еще используете приложение create-react-app для настройки своего проекта React? Переключитесь на Vite для повышения производительности и ускорения разработки.

Начиная новый проект React, многие разработчики обращаются к создать-реагировать-приложение в качестве основного командного инструмента для установки и настройки проекта. Однако Vite — лучшая альтернатива. Он предлагает более быстрое время разработки и лучшую производительность.

Что такое Вите?

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

Вите использует строить, сборщик на основе Go, который значительно быстрее, чем традиционные сборщики на основе JavaScript, чтобы ускорить процесс сборки исходного кода. Он также предварительно связывает зависимости вашего приложения и обслуживает исходный код поверх собственного ESM, позволяя браузерам оптимизировать загрузку модулей для более эффективного и быстрого применения производительность. Когда приходит время развернуть ваше приложение в рабочей среде, Vite имеет встроенную команду сборки, которая автоматически оптимизирует ваше приложение для развертывания, обеспечивая его бесперебойную работу.

instagram viewer

Создание проекта Vite

Перед созданием проекта Vite обратите внимание, что для Vite требуется Node.js версии 14.18+ или 16+. Вы можете обратиться к этим статьям, чтобы установить Node на свой компьютер с Windows или Ubuntu.

  • Как установить Node.js в Windows.
  • Учиться как установить Npm и Node.js на Ubuntu

Создайте проект Vite, запустив эту команду в терминале.

npm создать vite@latest

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

Далее Vite предложит вам выбрать фреймворк. Выберите Реагировать.

Vite также попросит вас выбрать вариант. Выберите JavaScript.

Когда Vite завершит формирование проекта, перейдите в созданный им каталог и установите зависимости через npm.

установка нпм

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

нпм запустить разработчик

Это должна быть главная страница.

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

Используйте Vite для быстрой скорости разработки

CRA (create-react-app) обычно является инструментом по умолчанию для настройки структуры проекта и конфигурации приложения React. Это удобно, так как все настроено за вас, но сборка и перезагрузка во время разработки могут быть медленными.

Vite, с другой стороны, использует собственные модули ES в браузере, чтобы обеспечить более быстрое время сборки. Если вы не хотите использовать Vite, вы можете выбрать мета-фреймворк React, такой как Next.js, поскольку он также разработан для обеспечения высокой производительности.