Дима Паутов

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

Если у вас нету никаких новомодных фреймворков, то сценарий простой. Берём вебпак, в него суём бабель, раз у вас импорты и экспорты с классами, настраиваем сборку файлов.
Разделяете всё на модули, например, из описанных вами:

//MobileMenu.js
export default class MobileMenu {
constructor() {
this.isVisible = false;
}

toggle () {
this.isVisible = !this.isVisible
}
}

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

// Catalog.js
import MobileMenu from '/path/MobileMenu'

(() => {
$(document).on('ready', () => {
let mobileMenu = new MobileMenu();
});
})()

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

Это грубый пример, но надеюсь, сможете что-то подчерпнуть.

P.S. У нас есть некоторые, большие проекты, на которых мы используем +- такой подход - это старые проекты, написанные давно, но до сих пор живущие. В один миг, была такая каша из хер пойми какого кода, не пойми, что за что отвечает, багов куча, т.к. где-то запускалось то, что не должно в принципе, код обрастал кучей костылей, условий. Было 2 варианта, как проекту жить дальше, переписать на rest + vue или сделать как я написал в ответе. Выбор пал на 2й вариант. Т.к. 1й вариант потребовал бы титонических усилий, что бы всё переписать, денег на это не дали бы.

Получилось вполне не плохо. Сейчас, при заходе нового проекта, мы сразу делаем rest api + vue. Не только потому, что это модно и т.п., а очень разделяет всё всё на компоненты, модули и т.п, отделяет бек от фронта, что уже облегчает разработку, ведь тебе уже не нужно бекенд разворачивать, делать постоянно миграции, бегать к бекендерам, если на их стороне что-то сломалось и т.п. удобства

убрать вообще вычисляемое свойство data и использовать просто
$store.getters['currency/getCapitalization']
в шаблоне, оно и так реативное. А ещё лучше так:

<template>
<div class="box">
<div class="currency" v-if="getCapitalization.capitalization">
{{getCapitalization.capitalization | comma | dollar}}
</div>
</div>
</template>

<script>
import { mapGetters } from 'vuex'
export default {
computed: {
...mapGetters('currency', [
'getCapitalization'
])
}
}
</script>

Есть подход mobile first, в котором разработка начинается с мобильной версии. Я никогда так не делал и считаю, это не удобным. Но это лично моё мнение. Просто погуглите, что это такое. Если те, кто дал вам задачу, шарят, как работать по подобной методологии, то вопросов быть не должно, хотя я считаю, что даже если начинать с мобильной, нужно видеть, как выглядит и десктопная, что бы понимать, что во что превращается

goods[key].cost

Форма отправляется через ajax. Расширение в url не показываются по разным причинам, либо бекенд так настроен, либо сервер так настроен

А вы знаете как работают проценты? Проценты - это значит какой-то процент от значения родителя. Вы инспектором посмотрите код! Посмотрите на элемент, которому вы дали 100% высоты, а теперь, посмотрите на родителя этого элемента. Какая у него высота?

Вам нужно растянуть сначала родителя, а уже потом ребёнка)))) Странно звучит))