Мультитенантность и семантический пользовательский интерфейс

Я ищу способ использовать несколько тем SUI в моем приложении Laravel, по одной теме для каждого арендатора (веб-сайта). У меня есть Semantic UI (semantic-ui-less repo), установленный как node_module.

Каким-то образом мне нужно иметь несколько файлов theme.config, чтобы указать на разные папки site, чтобы переопределить тему по умолчанию. Опять же, по одному на каждого арендатора. Затем я мог бы создать тему для конкретного арендатора, используя Gulp. Переопределение файла theme.config при каждой сборке gulp также является вариантом, но я не знаю, как решить эту проблему.

Еще один вариант, который я мог бы придумать, — иметь несколько файлов composer.json для каждого арендатора. Но я думаю, что это излишне только для создания тем и может вызвать проблемы с коллизиями.

В Интернете нечего найти, кроме этого вопроса без ответа. Я надеюсь, что кто-то может мне помочь!


themes gulp multi-tenant semantic-ui multisite
person JasonK    schedule 12.03.2016    source источник

Ответы (1)


arrow_upward
0
arrow_downward

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

Gulpfile.js

var Elixir  = require('laravel-elixir');
var gulp    = require('gulp');
var replace = require('gulp-replace');
var rename  = require('gulp-rename');
var util    = require('gulp-util');

/*
 |--------------------------------------------------------------------------
 | Tenants
 |--------------------------------------------------------------------------
 |
 | Build Semantic UI individually for each tenant.
 |
 */
if (typeof util.env.tenant === 'string') {

    var tenant = util.env.tenant;
    var tenantPath = 'storage/tenants/' + tenant + '/assets';
    var semanticPath = 'node_modules/semantic-ui-less/';

    Elixir.extend('theme', function(tenant) {

        new Elixir.Task('theme', function() {
            /**
             * Perform some magic by pointing the @siteFolder variable
             * to the current tenant's theme directory in order for each
             * tenant to have it's own unique Semantic UI theme.
             */
            return gulp.src([semanticPath + 'theme.config.example'])
                .pipe(replace("'site'", "'../../" + tenantPath + "/theme'"))
                .pipe(rename('theme.config'))
                .pipe(gulp.dest(semanticPath));
        });

    });

    Elixir(function(mix) {
        mix
            .theme(tenant)
            .less(semanticPath + '/semantic.less', tenantPath + '/css/semantic.min.css')
            .scriptsIn(semanticPath . '/definitions', tenantPath + '/js/semantic.min.js')
            .copy(semanticPath + '/themes/default/assets', tenantPath + '/css/themes/default');
    });

}

Использование gulp --tenant {name}

person JasonK    schedule 22.03.2016