Подключение в CommonJS окружении

Для работы с библиотекой Universal Router в среде CommonJS необходимо использовать синтаксис require, так как стандартный import поддерживается только в модулях ES. Основной подход заключается в установке пакета через менеджер npm и последующем подключении его в коде.

const UniversalRouter = require('universal-router').default;

Обратите внимание на использование .default. Дело в том, что Universal Router написан с использованием ES Modules. При импорте через CommonJS объект, экспортированный по умолчанию, помещается в свойство default.

Установка через npm

Для корректного подключения сначала нужно установить пакет:

npm install universal-router

После установки библиотека становится доступной для require в Node.js или в сборщиках вроде Webpack, которые поддерживают CommonJS.

Создание маршрутов

Маршруты в Universal Router определяются массивом объектов, где каждый объект описывает путь и обработчик. Пример структуры маршрутов:

const routes = [
  {
    path: '/',
    action: () => 'Главная страница'
  },
  {
    path: '/about',
    action: () => 'О нас'
  },
  {
    path: '/users/:id',
    action: ({ params }) => `Пользователь с ID: ${params.id}`
  }
];

Ключевые моменты:

  • path может содержать динамические сегменты (:id), которые Universal Router автоматически разбирает и передает в объект params.
  • action вызывается при совпадении маршрута и может возвращать любой результат: строку, объект, Promise.

Инициализация роутера

После создания массива маршрутов роутер инициализируется следующим образом:

const router = new UniversalRouter(routes);

Если требуется асинхронная обработка, action может быть асинхронной функцией:

{
  path: '/async',
  async action() {
    const data = await fetchData();
    return data;
  }
}

Universal Router корректно обрабатывает промисы и возвращает результат после завершения асинхронных операций.

Навигация и разрешение маршрутов

Для поиска подходящего маршрута и вызова его обработчика используется метод resolve:

router.resolve('/users/42').then(result => {
  console.log(result); // Пользователь с ID: 42
});

Метод resolve принимает строку с URL или объект с полями pathname и query. Он возвращает промис, что позволяет работать с асинхронными действиями внутри маршрутов.

router.resolve({ pathname: '/about', query: { ref: 'newsletter' } })
  .then(result => console.log(result));

Использование middleware-подобных функций

Universal Router поддерживает цепочку действий для маршрута через свойство before. Оно позволяет выполнять проверку или подготовку данных перед вызовом action:

const routes = [
  {
    path: '/dashboard',
    before: (context, next) => {
      if (!context.user) {
        throw new Error('Не авторизован');
      }
      return next();
    },
    action: () => 'Панель пользователя'
  }
];

Особенности работы с before:

  • Функция принимает объект контекста и функцию next.
  • Можно возвращать результат синхронно или через промис.
  • Позволяет реализовать проверку авторизации, логирование и другие промежуточные шаги.

Обработка ошибок

Ошибки в Universal Router можно обрабатывать с помощью стандартных конструкций try/catch или через метод .catch промиса:

router.resolve('/dashboard')
  .then(result => console.log(result))
  .catch(error => console.error('Ошибка маршрута:', error.message));

При работе в CommonJS это особенно важно, так как отсутствие обработки промисов приведет к необработанным исключениям в Node.js.

Контекст маршрута

Universal Router передает объект контекста в каждую функцию маршрута. Контекст может содержать любые данные, необходимые для работы action или before:

const context = { user: { id: 1, name: 'Alice' } };

router.resolve('/dashboard', { context })
  .then(result => console.log(result));

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

Итог структуры подключения в CommonJS

  1. Установка через npm: npm install universal-router.
  2. Подключение через require с использованием .default.
  3. Определение массива маршрутов с path и action.
  4. Инициализация роутера через new UniversalRouter(routes).
  5. Вызов метода resolve для обработки маршрутов.
  6. Использование before для промежуточной логики.
  7. Обработка ошибок через try/catch или .catch.

Эта схема позволяет полностью использовать возможности Universal Router в среде CommonJS, включая динамические маршруты, асинхронные действия и контекстные данные.

Оглавление