0xD34F

Вы вызываете done сразу после изменения show, поэтому элемент удаляется немедленно, не дожидаясь окончания анимации. Надо использовать коллбек onComplete:

leave(el, done) {
  TweenMax.to(el, 1, {
    x: 0,
    onComplete: done,
  });
},

Рекурсия же:

const invertTree = ({ value, left, right }) => {
  const node = { value };
  if (left) {
    node.right = invertTree(left);
  }
  if (right) {
    node.left = invertTree(right);
  }
  return node;
};

Вместо равенства искомой строке проверяйте, что значение атрибута её содержит - замените [data-type=" на [data-type*=".

Честно говоря, не очень понятно - а зачем тут вообще слоты. Передавайте в компонент данные обычным параметром, на их основе создавайте список.

Но если всё-таки нужно использовать именно слот - пишите собственную render-функцию. Т.е., вместо шаблона, который есть у вас сейчас, будет что-то вроде

export default {
  render(h) {
    return h('ul', this.$slots['list-item'].map(n => h('li', [ n ])));
  },
};

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

components: {
  SlotWrapper: {
    functional: true,
    render: (h, context) => context.props.node,
  },
},

<li v-for="n in $slots['list-item']">
  <slot-wrapper :node="n"></slot-wrapper>
</li>

Я честно говоря, ожидал что это будет работать из коробки, но увы...

А оно работает. Ищите косяк у себя. Может, параметр не определили как Boolean.

Хотите 1 при отсутствии значения - ну так и используйте 1 как значение по умолчанию, замените null на 1 в
let { page = null } = req.params;.

А сейчас у вас

offset принимает отрицательное значение

как раз из-за того, что null конвертируется в 0 при вычислении offset'а, 0 - 1 сколько будет - сами понимаете.

Уберите атрибуты href у v-tab'ов.

А ещё не вижу, чтобы у вас использовался v-app. Где v-app? Почему его нет?

fetch(filename)
  .then(r => r.text())
  .then(r => r.split('\n').map(n => {
    const [ key, val ] = n.split(' = ');
    return { [key]: val };
  }))
  .then(arr => {
    // ну вот вам ваши объекты
  });

UPD. Если вдруг в файле есть ещё что-то, кроме строк указанного вами вида, можно получать их с помощью регулярных выражений, надо будет заменить r.split('\n') на r.match(/\$[a-z0-9-]+ = #[0-9a-f]{6}/g), например.

Документацию открывать пробовали?

Ну и вообще - было бы нелишним ознакомиться с хотя бы основами SQL, чтобы самостоятельное решение подобных вопросов не вызывало затруднений, по крайней мере будете знать что искать.

foreach ($arr as $el) {
  $grouped[explode('/', $el)[2]][] = $el;
}

Почитайте про async/await, у вас будет что-то вроде:

async (req, res) => {
  let getProfile = await User.findAll

Ну или в then дёргайте res.render.

Да так же, как у вас есть сейчас со встроенным скриптом - указываете type="text/babel" вашему отдельному файлу при подключении.

А вообще, вам стоит загуглить: "webpack", "create-react-app".

const months = Array.from({ length: 12 }, (n, i) => {
  return new Date(0, i).toLocaleString('en', { month: 'short' }).toLowerCase();
});

const newArr = arr.map(({ data, ...item }) => (
  data.forEach((n, i) => item[months[i]] = n),
  item
));

function () {
  axios.get(api.udpEmulatorProxy)

Может, всё-таки return axios.get?

this.getShips()
this.$store.commit('getShips', 10)

Что-то не улавливаю смысла этого куска кода. Наверное, надо в мутацию (кстати, а почему её имя начинается с get? - смысл-то в установке значения, так что правильно было бы set) передавать те данные, что возвращает getShips:

this.$store.commit('getShips', await this.getShips());

А если эти данные должны лежать в хранилище, то, возможно, их получение стоит оформить в виде действия, а не как отдельно лежащую функцию / метод компонента.

overflow: auto

например

Делаете всем одинаковым элементам одинаковые классы - link, screen - без цифр.

Для элементов .screen определяете ещё один класс:

.screen {
  display: none;
}

.screen.active {
  display: flex;
}

И просто переключаете его:

$(document).on('click', '.link', function() {
  const $screen = $(this).next().toggleClass('active');
  $('.screen.active').not($screen).removeClass('active');
});

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

function combine(keys, values) {
  const length = Math.max(0, ...values.map(n => n.length));
  const arr = Array.from({ length }, () => ({}));
  values.forEach((n, i) => n.forEach((v, j) => arr[j][keys[i]] = v));
  return arr;
}

// или

const combine = (keys, values) =>
  Array.from(
    { length: values.reduce((max, { length: n }) => max > n ? max : n, 0) },
    (_, j) => keys.reduce((acc, k, i) => (
      j < values[i].length && (acc[k] = values[i][j]),
      acc
    ), {})
  );

// или

const combine = (keys, values) =>
  keys.reduce((acc, k, i) => (
    values[i].forEach((v, j) => (acc[j] = acc[j] || {})[k] = v),
    acc
  ), []);

Пользоваться всем этим, понятное дело, так:

const newArray = combine([ 'name', 'id' ], [ nameArray, idArray ]);

Мне кажется, вы пытаетесь заниматься какой-то ерундой. Гораздо проще будет вешать/снимать класс, вместо того, чтобы напрямую модифицировать body.style.

UPD. Но конечно можно и модифицировать. Только добавлять/убирать ничего не надо, всегда вычисляйте значения свойств целиком.

Делаете grad вычисляемым свойством, вместо установки значения делаете emit, и используете v-model. Как-то так.