Вендоры

Вендор (Vendor) — это сторонняя программная библиотека, которая используется внутри системы и доступна в SDK через пространство имён Universe.Vendor. Как правило, эта библиотека предоставляется «как есть», однако в отдельных случаях может быть модифицирована продуктом под свои нужды.

Внутри системы используется множество сторонних библиотек, но доступны в SDK они становятся только по следующим причинам:

• Без этой библиотеки потребитель не сможет реализовать определённую функциональность;
• Библиотека глубоко интегрирована в систему и стала частью публичного API SDK;
• Библиотека реализует синглтон и не может подключаться из внешних модулей без риска конфликтов;

Список вендоров

Ниже представлен список вендоров с версиями, поставляемыми в SDK и ссылками на внешнюю документацию к этим библиотекам:

Библиотека в SDK	Версия библиотеки	Внешняя документация
Universe.Vendor.React	16.14.0	16.reactjs.org
Universe.Vendor.Mobx	4.15.7	NPM Github
Universe.Vendor.MobxReact	6.3.1	NPM
Universe.Vendor.Moment	2.30.1	momentjs.com

Использование

// ПРАВИЛЬНО:

import {Universe} from '@universe-dg/sdk';

const {Mobx, MobxReact, React} = Universe.Vendor;

// Или не импортируя пакет `@universe-dg/sdk`:
// const {Mobx, MobxReact, React} = window.Universe.Vendor;

@MobxReact.observer
class MyComponent extends React.Component {
    @Mobx.observable
    counter = 0;
    
    @Mobx.action
    increase = () => {
        this.conunter = this.counter + 1;
    };
    
    render() {
        return <button onClick={this.increase}>{this.counter}</button>;
    }
}
Копировать

Нельзя обращаться к вендорам подключая их во внешние модули как зависимости:

// НЕПРАВИЛЬНО:

import React from 'react';
import {observable, action} from 'mobx';
import {observer} from 'mobx-react';

@observer
class MyComponent extends React.Component {
    @observable
    counter = 0;
    
    @action
    increase = () => {
        this.conunter = this.counter + 1;
    };
    
    render() {
        return <button onClick={this.increase}>{this.counter}</button>;
    }
}
Копировать

Это может привести к ошибкам при исполнении кода.

Вендоры в зависимостях внешнего модуля

Если во внешнем модуле используются зависимости, требующие вендоров в качестве собственных зависимостей, то потребитель может самостоятельно настроить подмену импортов в своём сборщике, для того, что бы на этапе сборки все импорты вендоров внутри зависимостей подменялись на пути к вендорам в SDK:

Пример настройки подмены путей при сборке через Vite:

// vite.config.js
import {defineConfig} from 'vite';
import {viteExternalsPlugin} from 'vite-plugin-externals';

export default defineConfig(() => ({
        
    // ...
    
    plugins: [
        
        //... 
        
        viteExternalsPlugin({
            react: ['Universe', 'Vendor', 'React'],
            mobx: ['Universe', 'Vendor', 'Mobx'],
            'mobx-react': ['Universe', 'Vendor', 'MobxReact'],
            moment: ['Universe', 'Vendor', 'Moment']
        })
    ],
}));
Копировать

Пример настройки подмены путей при сборке через Webpack:

// webpack.config.js
module.exports = {
    
    // ...
  
    externals: {
        react: 'Universe.Vendor.React',
        mobx: 'Universe.Vendor.Mobx',
        'mobx-react': 'Universe.Vendor.MobxReact',
        moment: 'Universe.Vendor.Moment'
    }
};
Копировать