Injective Typescript Configuring React.
Настройка React
React - библиотека для построения пользовательских интерфейсов
В настоящее время React является одним из самых популярных UI-фреймворков. Мы поможем вам настроить React + конструктор Vite с пакетами @injectivelabs и некоторыми полифиллами, поскольку они понадобятся вам для взаимодействия с криптовалютными кошельками.
1. Установка React
Следуя руководству по началу работы на сайте, настройте свое приложение.
2. Установка пакетов @injectivelabs
Установить пакеты @injectivelabs можно с помощью yarn.
$ yarn add @injectivelabs/sdk-ts @injectivelabs/networks @injectivelabs/ts-types @injectivelabs/utils
## If you need Wallet Connection $ yarn add @injectivelabs/wallet-ts
Это наиболее часто используемые пакеты из монорежима injective-ts.
3. Настройка Vite и добавление полифиллов
Сначала добавьте необходимые пакеты полифиллов
$ yarn add @bangjelkoski/vite-plugin-node-polyfills
4. Использование менеджера состояний
В React существует множество различных менеджеров состояний, выберите тот, который вы собираетесь использовать, и установите его. Вы можете использовать встроенный Context API для управления состояниями без необходимости установки стороннего решения. Предпочтительными сторонними менеджерами состояний являются Redux и Zustand.
5. vite.config.ts
Последний шаг - это настройка Vite на использование полифиллов node, которые мы установили ранее.
Откройте файл vite.config.ts и добавьте node-polyfills в массив plugins.
Конфигурация должна выглядеть следующим образом:
import { defineConfig } from "vite"; import react from "@vitejs/plugin-react-swc"; import { nodePolyfills } from "@bangjelkoski/vite-plugin-node-polyfills";
// https://vitejs.dev/config/ export default defineConfig({ plugins: [react(), nodePolyfills({ protocolImports: true })], });
8. Загрузка нашего приложения
Наконец, вы можете запустить приложение локально с помощью yarn dev или собрать его для производства с помощью yarn build, которое можно развернуть на любом хостинге статических страниц, например Netlify, Vercel и т.д.