Дима Паутов

Использовать ссылку что в коментах вам дали https://learn.javascript.ru/js-animation

Либо, просто указать эту анимацию через css.
transition: .2s ease-in-out;
а через js меняете значение ширины или других свойств. На мой взгляд это куда проще, чем заморачиваться и писать их на js.

setTimeout

https://jsfiddle.net/bg3s1k5o/2/

На проде бандл пересобирают!!!! Прод - это не дев мод, где всё на лету собирается и меняется. На прод 1 раз собралось и всё. Сделали новую фичу, правку и т.п., выкатили, пересобрали.

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

Окружение - это тестовый полигон, либо боевой полигон. Обычно проекты сопровождаются переменными окружения(.env ну или иными, сути не меняет) в которых прописываются разные, нужные проекту данные. Api url, режим(production, development, ещё бывает stage), порт, имя приложения для удобной отладки при запуске именованного процесса на котором будет запускаться приложение и т.п. Следовательно, во время сборки, переменные окружения заносятся в бандл и там уже хранятся.

Переменные окружения лучше тоже на хранить в гите, т.к. любой разработчик без проблем должен иметь возможность менять эти значения на свои. Например, порт дев сервера. У меня например порт 3000 может быть занят чем-то своим и что бы запустить приложение, я просто сменю порт на свой.

Либо собрать у себя на компе, а потом залить, дабы не тратить ресурсы сервера в этот момент. А потом просто рестарт сервера. Такой вариант подходит, если у вас всегда 1 источник данных. И вам по сути не нужны никакие переменные окружения. Но как по мне, они всегда должны быть.

Зашли на сервер, создали файлик с переменными в вашей директории и всё.
Открыли терминал, дали команду, собрали. Либо автоматизировать этот процесс, но это уже другая история

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

let inputVal = inp1.value 
let array = inputVal.split(',').map(Number)
console.log(array)

использовать событие input или change, внутри функции выводить нужные вам значение в зависимости от вашей логики

$('[type="password"]')
// Или дать класс этим полям
$('.inputPassword')

Если вы используете querySelectorAll для работы с шаблоном компонента, то похоже вы делаете что-то не правильно.

$ref единственное и по сути правильное получение DOM элемента внутри vue. $ref это по сути id, иных вещей нет, только уже указание селекторов для querySelectorAll.
Если вам приходится каждому элементу DOM давать ref внутри 1го шаблона, то опять же, скорей всего вы что-то делаете не так.

Покажите или расскажите детальнее, какую задачу вы решаете и скорей всего есть решение лучше, нежели то, что вы пытаетесь сделать

localStorage - это вам не переменная в привычном виде. Там хранятся только строковые значения. Перед тем, что бы 1 из объектов там изменить, нужно сначала распарсить всё имеющееся там, изменить это или его часть, а потом снова положить всё обратно.

P.S. localStorage можно только перезаписать

инициализировать его 2 раза, с разными настройками и к разным классам/id

Параметры фильтра должны храниться в адресной строке. Причин несколько, это удобство пользователю, удобство отладки, возможность перехода из рассылок сразу к нужной категории и параметрам товаров(например, если пользователь решил сделать рассылку на интересующие его характеристики товаров, опять же, если такая фича есть) или просто дал ссылку другу на указанные товары. Адресная строка не обязана быть человеко читаемой, но желательно. Для этого url и есть - сделать запрос на сервер и получить от него указанные данные.