Aetae

Верить клиенту конечно нельзя, но можно сделать вид что веришь:
1. рассчитывай число и на клиенте и на сервере.
2. в начале расчёта один раз синхронизируй с сервером.
3. выводи рассчитываемое на клиенте число с какой угодно плавностью.
4. если синхронизация прям очень важна - продолжай слать число с сервера и сравнивать с клиентом, если разница в пределах (заданной) погрешности - ничего не делай, еслы вышла за пределы - меняй клиентское(ничего страшного если такое будет происходить изредка).
5. если сама по себе синхронизация не особо важна, а важно лишь конечно число, то собственно сравнивай клиентское с серверным только в самом конце. Если совпало (с погрешностью в нужную сторону) - всё ок. Не совпало - клиент хацкер - идёт нафиг.

У любого нормального клиента всё всегда будет совпадать, мегаредкие исключения со сломанными системными часами в любом случае будут баговать, а хацкеры нам и не нужны.

results.unshift({ id: 0, text: 'Без категории' });

Object.assign - работает как называется: assign, не add, append, push или ещё как-то. Он присваивает первому аргументу ключи второго(т.е. перезаписывает, если такие у присутствуют). В случае массива ключом является индекс.

Нужна - сделайте. Это элементарный javascript, vue тут не при чём.

Потому что селектор div.filtr form ul li:not(.sf-field-sort_order) выбирает все li(кроме .sf-field-sort_order) которые находятся внутри div.filtr form ul, т.е. и <li>тест</li> в том числе. Если тебе нужны только прямые потомки, то надо писать так:

div.filtr > form > ul > li:not(.sf-field-sort_order)

и тогда всё будет работать как ты задумывал.

const delay = (ms) => new Promise(resolve => setTimeout(resolve, ms));

const request = () => fetch('https://your-request-url.ru')
	.then(response => response.json())
  .then(console.log);

async function repeat(request, interval = 5000, times = Infinity) {
  do {
    await request();
    
    if (--times < 1) break;
    
    await delay(interval);
    
  } while (true);
}

repeat(request, 5000, 5)

Сделать октоторп элементом стиля, а не частью слова:

.nav-link::before {
    content: '#';
    font-weight: bold;
    color: #f0f;
}

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

Конкретизировать на что именно он вешает обработчики.
Не $('.button').click(...) который повесит на все .button на странице - и старые и новые, а $(container).find('.button').click(...), где container - родительский элемент нового добавляемого блока.

В Vue 3 нет никакого Vue.use(), теперь все плагины ставятся не глобально, а в конкретное приложение:

import { createApp } from 'vue'
import { createStore } from 'vuex'

// Create a new store instance.
const store = createStore({
  state () {
    return {
      count: 0
    }
  },
  mutations: {
    increment (state) {
      state.count++
    }
  }
})

const app = createApp({ /* your root component */ })

// Install the store instance as a plugin
app.use(store)

(из официальной документации vuex)

Ну и modelair верно сказал - теперь топят за pinia вместо vuex, что и к лучшему, так как по сути выкинули весь оверинжинирнутый мусор из vuex оставив только осмысленный функционал.

С гарантией - надо копаться в исходниках, как предложил Сергей delphinpro.
Однако перед этим я бы зашёл на первый попавшийся в гугле онлайн-хэшер(например) и захэшировал проверочное слово, результат чего сравнил бы с вариантом из админки. Почти наверняка используется какая-то стандартная хэш функция, и тебе достаточно на глаз её узнать.

Чуть более сложно чем нужно тебе:



Упростишь сам, если надо.)

Без вариантов. Мешать классы в ts незя, потому что он как и js не поддерживает множественное наследование. Все методы сбоку через прототипы - не подразумевают работу с классами.
Помимо того что сам js физически не даст тебе работать с нативными приватными свойствами(#), так уже ts не даст тебе работать нормально с приватными и защищёнными(private и protected), а микс абстрактных (abstract) вообще забагован и не работает(issue у них пару лет висит на гитхабе).

В общем только крайне ограничено.

Ну в принципе можно как с любыми переменными - вынести за компонент, и даже будет работать, но так делать не надо.)

Нормальное решение - использовать context всесто ref. Сверху где-то его Provider зафигачить, а где надо useContext.

Скорее всего поможет перегрузка, что-то типа:

function getSkills(params: TGetSkills['requestParams']): TGetSkills['response'];
function getSkills(params: TGetSkillsWithCriterions['requestParams']): TGetSkillsWithCriterions['response'];
function getSkills(
    params: (TGetSkills | TGetSkillsWithCriterions)['requestParams'],
  ) {
    return instance.get<(TGetSkills | TGetSkillsWithCriterions)['response']>('url', {
      params: params,
    }),
}

getSkills: getSkills

require работает на этапе компиляции. Т.е. во время исполнения он уже должен был собрать все вызовы require и положить их в .js файл. require не может быть динамичным, потому что на этапе исполнения его тупо уже нет - он заменён на то, что он возвращает.

Для решения подобных задач два варианта:
1. require.context - который соберёт все файлы по предоставленному шаблону на этапе компиляции, и на этапе исполнения будет их подставлять. Этот вариант подходит если в папке img уже сейчас лежат все нужные изображения.
2. Если изображения на этапе компиляции отсутствуют, а появляются каким-то сторонним образом в паке потом, то require тебе тут не нужен(и не поможет), просто динамически подставляй пути к ним как в твоём первом варианте.
Путь от корня, если что, можно получить из __webpack_public_path__:
root: __webpack_public_path__,

<img :src="root + 'img/' + message.filename" :alt="message.filename"/>

Во первых DI в js\ts - полная бессмысленная хуита. Просто импортируй по-человечески что надо и используй.

Но если очень хочется - это сложно. Механизм DI не предусмотрен в парадигме языка. Тебе придётся использовать свою особую надстройку над системой сборки, которая найдёт в файлах подобные DI и заменит их на обычные человеческие импорты. Сделать можно это тремя основными способами: как трансформермер для typescript, как трансформермер для babel и как кастомный loader для webpack. Во всех случаях это включает в себя работу с AST и кодогенерацию на этапе сборки.

Впрочем, в залежах npm наверняка можно нарыть что-то готовое, чтоб не писать самому.

Если changeTab не может примать async функцию(функцию возвращающую Promise) то никак. Ожидание действия пользователя - асинхронная операция. Тебе надо изменить логику поведения.

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

const result = await modal({
  title: ...,
  type: 'confirm',
  acceptText: 'Подтвердить',
  ...
})

Но если что-то колхозить, то условно так:

showPopup() {
  this.isDialogShown = true;
  this.pending = new Promise((resolve) => {
    this.discardChanges = () => resolve(false);
    this.saveChanges = () => resolve(true);
  });
},
async changeTab() {
  ...
  return await this.pending;
}

Ну или прямо так:

changeTab() {
  return new Promise((resolve) => {
    this.discardChanges = () => resolve(false);
    this.saveChanges = () => resolve(true);
  });
}

Но я бы так делать не стал, а таки вынес нормально всё, ибо один компонент должен выполнять ровно одну функцию и его логика не должна просачиваться в иные.