С помощью пакетного менеджера

Effector не требует использования какого-то одного пакетного менеджера, можете использовать любой на свой выбор.
Например: yarn, pnpm.

Terminal window
npm install effector

React

Terminal window
npm install effector effector-react

Вы можете начать использовать effector онлайн с помощью шаблона Stackblitz внутри которого уже настроен TypeScript, ViteJS и React.

Vue

Terminal window
npm install effector effector-vue

Solid

Terminal window
npm install effector effector-solid

Svelte

Svelte работает с effector без установки дополнительных пакетов.

Online playground

Все примеры в этой документации запускаются в нашей онлайн песочнице. Она позволяет запускать, тестировать и распространять свои идеи бесплатно и без установки. React и синтаксис TypeScript поддерживаются без дополнительной настройки. Репозиторий проекта.

Deno

поддерживается с версии

effector 21.0.0

Чтобы использовать effector, просто импортируйте effector.mjs из любого CDN.

import { createStore } from "https://cdn.jsdelivr.net/npm/effector/effector.mjs";

Примеры CDN:

DevTools

Используйте effector-logger для вывода изменений сторов в консоль, вывода их значений в браузерный интерфейс и подключения к Redux Dev Tools.

Для рендеринга на сервере и написания тестов вам понадобятся плагины для компилятора:

Babel

Плагин для Babel включен в поставку основного пакета effector и не требует установки.

Читайте детали по ссылке.

SWC

Terminal window
npm install -ED @effector/swc-plugin @swc/core

Документация плагина.

Совместимость

Для совместимости с устаревшими версиями браузеров до IE11 и Chrome 47 (версия браузера для Smart TV) используйте импорты из файлов: effector/compat, effector-react/compat и effector-vue/compat.

Вы можете заменить импорты вручную:

import {createStore} from 'effector'
import {createStore} from 'effector/compat'

А также используя плагин babel-plugin-module-resolver. Примерная конфигурация в .babelrc:

{
  "plugins": [
    [
      "babel-plugin-module-resolver",
      {
        "alias": {
          "^effector$": "effector/compat",
          "^effector-react$": "effector-react/compat"
        }
      }
    ]
  ]
}

Polyfills

Effector использует некоторые глобальные объекты, в старых версиях браузеров их может не быть, поэтому вам может понадобиться установить их самостоятельно, если вы собираетесь поддерживать такие браузеры.

Вам может понадобиться установить следующие полифиллы:

  • Promise
  • Object.assign
  • Array.prototype.flat
Перевод поддерживается сообществом

Документация на английском языке - самая актуальная, поскольку её пишет и обновляет команда effector. Перевод документации на другие языки осуществляется сообществом по мере наличия сил и желания.

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

Соавторы
Commits