React.js — это библиотека JavaScript, используемая для создания внешнего интерфейса одностраничного веб-приложения. Это снижает сложность приложения, разделяя пользовательский интерфейс на небольшие и более управляемые компоненты. В этой статье обсуждается альтернативный способ настройки приложения React с помощью Vite. прежде чем следовать, вы должны сначала понять основы реакции js. reactjs.org.
Что такое Вите?
Vite — это инструмент сборки, который способствует более быстрой разработке для разработчиков. Его создал Эван Ю.
Vite поддерживает следующее:
- Горячая замена модуляБыстрый сервер разработки, обеспечивающий быструю замену модуля (HMR) благодаря расширенным функциям. Подробнее о
ES native modules
можно прочитать здесь. - Rollup В Vite есть команда сборки, которая связывает код разработчика с Rollup. Это сборщик модулей JavaScript, который компилирует простые фрагменты кода и встраивает их в сложные приложения. Поскольку Rollup предварительно настроен, можно легко создавать статические приложения, оптимизированные для производства. Вы можете получить дополнительную информацию о
Rollup
здесь.
Преимущества Вайта
На продуктивность разработчика влияет множество факторов, включая производительность и скорость. JavaScript может замедлять работу приложения в зависимости от его сложности. Vite решает эту проблему с помощью Esbuild. EsBuild — это средство предварительной сборки зависимостей, которое улучшает предварительное объединение зависимостей по сравнению с другими платформами. Это приводит к увеличению скорости сервера и горячей замене модулей.
Особенности Вайт
Ключевые особенности Vite включают в себя:
- Мгновенный запуск сервера.
- Быстрая замена горячего модуля.
- Оптимизирован процесс сборки.
Давайте теперь создадим приложение React с помощью Vite.
Создание приложения для реагирования с использованием Vite.
- Откройте терминал и создайте новую папку, затем войдите в созданную папку. здесь мы создадим react.js, используя vite.it здесь.
2. После этого давайте создадим react.js с помощью vite. Обратите внимание, что в этом руководстве мы будем использовать npm. Однако, если вы предпочитаете пряжу, вы можете получить к ней доступ здесь.
3. Далее заполняем название проекта, который будем создавать вместе с фреймворком, здесь я выбираю react.js и выбираю вариант java script.
4. Теперь, когда мы создали React.js с помощью Vite, выполните следующие действия.
5. Прежде чем мы выполним последний шаг — npm run dev, я предпочитаю сначала войти в Visual Code, выполнив code. затем откройте терминал в визуальном коде, выполнив ctrl+`, затем npm run dev
примечания: Ваш файл package.json
должен выглядеть, как показано ниже:
6. После того, как вы наберете npm run dev, вы можете выбрать параметры….
I. Нажмите h, чтобы отобразить справку
II. Нажмите r, чтобы перезапустить сервер
III. щелкните u, чтобы показать URL-адрес сервера
IV. Нажмите o, чтобы открыть в браузере
V. нажмите q, чтобы выйти
7. И это результат, который мы создали
I hope this article can help you. Thanks for everything