flafy4

Посмотрите сюда
https://stackblitz.com/edit/angular-router-basic-e...

Как ни странно, с помощью метода stop.

const obj1 = {
            foo: {
                bar: {
                    value: 'final'
                }
            }
        }

const getBreadcrumbs = (data, accumulate = []) => {
   Object.keys(data).forEach(key => {
      if (typeof data[key] === 'object') {
        accumulate.push(key);
        return getBreadcrumbs(data[key], accumulate);
      } else {
      	accumulate.push(key);
        return accumulate;
      }
   });
   
  return accumulate;
};

const breadcrumbs = getBreadcrumbs(obj1).join('.');
console.info(breadcrumbs); // 'foo.bar.value'

Работает только если в исходном объекте и каждом узле всего одно свойство

Алгоритм довольно тяжёлый, я думаю, что можно попробовать конвертировать исходный объект в строку и как-то её парсить, но это просто догадка. В продакшен я бы такой код старался не пускать.

const obj1 = {
  foo: {
      bar: {
          value: 'final'
      }
  }
};

function getDeepKeys(obj) {
  let keys = [];

  for(const key in obj) {
    keys.push(key);
  
    if(typeof obj[key] === "object") {
      const subkeys = getDeepKeys(obj[key]);
    
      keys = keys.concat(subkeys.map(subkey => `${key}.${subkey}`));
    }
  }

  return keys;
}

console.log(getDeepKeys(obj1)); // ["foo", "foo.bar", "foo.bar.value"]

Что делать с результатом - сообразите уже сами

А почему строка? Могли бы и сами догадаться её в массив порезать:

const arr = str.split('-');
const end = 'final';

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

const obj = arr.reduceRight((acc, n) => ({ [n]: acc }), end);

Но, конечно, если очень хочется, то рекурсия возможна:

const obj = (function createObj(arr, i, end) {
  return i < arr.length
    ? { [arr[i]]: createObj(arr, i + 1, end) }
    : end;
})(arr, 0, end);

Если я верно понял задачу, то как-то так:

const obj = {
	param1: "1",
	param2: "string",
	param3: "false"
};

function convertType(prop) {
	try {
		return JSON.parse(prop);
	} catch (e) {
		if (e.name === 'SyntaxError') {
			return prop;
		}
		throw e;
	}
}

Object.entries(obj).forEach(([key, value]) => {
	obj[key] = convertType(value);
});

console.log(obj); // {param1: 1, param2: "string", param3: false}

Поместить логику работы в сервис и инжектить его в компоненты через встроенный механизм DI

Советую прочесть данную статью:
https://vuex.vuejs.org/ru/guide/modules.html

Очищай канвас полностью и градиентом дорисовывай хвост

Всё меняет. Легко проверить в консоли:

Возможно, у тебя помимо (или вместо) \n есть также \r
Попробуй так:
str.replace(/@tag(.|\n|\r)*?@tag/gm, 'replace')
Или так (универсально):
str.replace(/@tag[\s\S]*?@tag/gm, 'replace');

Из метода switcher возвращайте объект с методом show.
https://learn.javascript.ru/task/chain-calls

Написать галп-плагин и воткнуть его в pipe

Каркас может быть примерно таким:

const through = require('through2');
const PLUGIN_NAME = 'my plugin ';
const myPlugin = function (options) {
    return through.obj(function (file, enc, cb) {
        if (file.isNull()) {
            cb(null, file);
            return;
        }
        if (file.isStream()) {
            cb(new Error(PLUGIN_NAME + 'Streaming not supported'));
            return;
        }
        try {
            let content = file.contents.toString();
            content     = '';// ... что-то делаем
            file.contents = Buffer.from(content);
        } catch (err) {
            this.emit('error', new Error(PLUGIN_NAME + err.message));
        }

        this.push(file);
        cb();
    });
};

Используем

function build() {
    return gulp.src('./src/css/*.css')
        .pipe(myPlugin)
        //...
}

Если нужно фильтровать по расширению (если src считывает разные файлы), можно добавить условие

if (/\.css$/.exec(file.path) !== null) {
  //...
}

Есть такая штука, как gulp-tap, с ее помощью можно решить вашу задачу.

А в целом - содержимое файлов можно получать вне зависимости от сборщиков и таск-раннеров с помощью fs.readFile или fs.readFileSync (пример).

https://laravel.com/docs/5.8/views#sharing-data-wi...
Cоздаешь провайдер и шаришь в нем переменную с имейлом, а в футере просто выводишь

Как правильно реализовывать какой либо административный функционал в SPA?

в вебе у вас один (простой*) вариант знать, что запрос пришел от авторизированного пользователя - куки

*сложные и не всегда рабочие смотрите в коментах

Если сделать просто защищенные роуты типа - example.com/admin с защитой, то это не совсем правильно как я понимаю ибо можно открыть в конце концов build.js и увидеть там статический HTML на всех этих "защищенных аутентификацией и правами пользователей" страницах.

и правильно. Перед тем как процессить запрос в апи проверяются права пользователя

Возникает очевидное решение - делать такие админки на отдельных доменах, ибо все равно весь функционал и взаимодействия с БД осуществляются с помощью RESTfull API.

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

можно открыть в конце концов build.js и увидеть там...

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

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

В интересующем вас компоненте определяете хук beforeRouteEnter - в нём и инициируете получение данных. Как оно конкретно выглядит - непосредственно выполнение запроса, или вызов экшена - тут вам виднее. После получения данных дёргаете next. Всё.

UPD. Не, не всё. Если не очень поняли, о чём я - сделал небольшой пример. Три роута, первые два ни о чём, последний - показывает данные из хранилища. И при каждом переходе инициирует их обновление.