Js Плагины не работают!

Подскажите пожалуйста куда смотреть!

Есть 2 что-то вроде плагина написаны на js Первый:

class Settings {
  get options() {
    return {
      attributes: {
        placement: 'vertical',
        behaviour: 'pinned',
        layout: 'fluid',
        radius: 'rounded',
        color: 'light-blue',
        shadow: 'min',
        butcolor: 'orchid',
        colorcard: 'c-medium-purple',
        navcolor: 'default',
        playercolor: 'orchida',
      },
      storagePrefix: 'acorn-standard-',
      showSettings: true,
      carryParams: false,
    };
  }

  constructor(options = {}) {
    this.settings = Object.assign(this.options, options);
    this.settings.attributes = Object.assign(this.options.attributes, options.attributes);

    this.attributeOptions = {
      placement: {
        event: Globals.menuPlacementChange,
        update: false,
        attribute: 'data-placement',
      },
      behaviour: {
        event: Globals.menuBehaviourChange,
        update: false,
        attribute: 'data-behaviour',
      },
      layout: {
        event: Globals.layoutChange,
        update: true,
        attribute: 'data-layout',
      },
      radius: {
        event: Globals.borderRadiusChange,
        update: true,
        attribute: 'data-radius',
      },
      color: {
        event: Globals.colorAttributeChange,
        update: true,
        attribute: 'data-color',
      },
      shadow: {
        event: Globals.shadowChange,
        update: true,
        attribute: 'data-shadow',
      },
      butcolor: {
        event: Globals.butcolorChange,
        update: true,
        attribute: 'data-butcolor',
      },
      colorcard: {
        event: Globals.colorcardChange,
        update: true,
        attribute: 'data-colorcard',
      },
      playercolor: {
        event: Globals.playerColorChange,
        update: true,
        attribute: 'data-playercolor',
      },
      navcolor: {
        event: null,
        update: true,
        attribute: 'data-navcolor',
      },
    };
    this.optionSelector = '#playerSetting .option';
    this._init();
  }

  _init() {
    this._mergeOverridePrefix();
    this._mergeAttributesFromStorage();
    this._mergeOverrides();
    this._mergeUrlParameters();
    this._modifyLinksCarryParams();
    this._setAttributes();
    this._setActiveOptions();
    this._addListeners();
    this._setVisibility();
  }

  _mergeAttributesFromStorage() {
    for (const prop in this.settings.attributes) {
      if (localStorage.getItem(this.settings.storagePrefix + prop)) {
        this.settings.attributes[prop] = localStorage.getItem(this.settings.storagePrefix + prop);
      } else {
        localStorage.setItem(this.settings.storagePrefix + prop, this.settings.attributes[prop]);
      }
    }
  }

  _mergeOverrides() {
    const overrideJSON = this._getOverrideJSON();
    if (!overrideJSON) {
      return;
    }
    const overridedAttributes = Object.assign(this.settings.attributes, overrideJSON.attributes);
    this.settings = Object.assign(this.settings, overrideJSON);
    this.settings.attributes = overridedAttributes;
  }

  _mergeOverridePrefix() {
    const overrideJSON = this._getOverrideJSON();
    if (!overrideJSON) {
      return;
    }
    if (overrideJSON.storagePrefix) {
      this.settings.storagePrefix = overrideJSON.storagePrefix;
    }
  }

  _getOverrideJSON() {
    const override = document.documentElement.getAttribute('data-override');
    if (!override) {
      return null;
    }
    const overrideJSON = JSON.parse(override);
    return overrideJSON;
  }

  _mergeUrlParameters() {
    const queryString = window.location.search;
    const urlParamsDecoded = decodeURIComponent(queryString);
    const urlParams = new URLSearchParams(urlParamsDecoded);
    const urlJSON = JSON.parse(urlParams.get('params'));
    if (urlJSON && urlJSON.attributes) {
      const overridedAttributes = Object.assign(this.settings.attributes, urlJSON.attributes);
      this.settings = Object.assign(this.settings, urlJSON);
      this.settings.attributes = overridedAttributes;
    }
  }

  _modifyLinksCarryParams() {
    const queryString = window.location.search;
    if (queryString !== '') {
      document.addEventListener('click', (event) => {
        if (!this.settings.carryParams) {
          return;
        }
        const closestAnchor = event.target.closest('a');
        if (closestAnchor && !closestAnchor.getAttribute('href').includes('#')) {
          const queryString = window.location.search;
          document.location = closestAnchor.getAttribute('href') + queryString;
        }
        event.preventDefault();
      });
    }
  }

  _setAttributes() {
    for (const prop in this.settings.attributes) {
      document.documentElement.setAttribute(this.attributeOptions[prop].attribute, this.settings.attributes[prop]);
    }
  }

  _setActiveOptions() {
    this._clearActiveOptions();
    document.querySelectorAll(this.optionSelector).forEach((el, i) => {
      if (el.dataset.value === this.settings.attributes[el.dataset.parent]) {
        el.classList.add('active');
      }
    });
  }

  _clearActiveOptions() {
    document.querySelectorAll(this.optionSelector).forEach((el, i) => {
      el.classList.remove('active');
    });
  }

  _addListeners() {
    document.querySelectorAll(this.optionSelector).forEach((el, i) => {
      el.addEventListener('click', this._onOptionClick.bind(this));
    });
    document.documentElement.addEventListener(Globals.lightDarkModeClick, this._onLightDarkModeClick.bind(this));
    document.documentElement.addEventListener(Globals.pinButtonClick, this._onPinButtonClick.bind(this));
  }

  _onOptionClick(event) {
    event.preventDefault();
    const clickedEl = event.currentTarget;
    const clickedVal = clickedEl.dataset.value;
    const parentId = clickedEl.dataset.parent;
    this.updateAttribute(parentId, clickedVal);
  }

  _setVisibility() {
    if (!this.settings.showSettings) {
      document.getElementById('playerSetting') && document.getElementById('playerSetting').classList.add('d-none');
      document.getElementById('playerSettings') && document.getElementById('playerSettings').classList.add('d-none');
    }
  }

  _onLightDarkModeClick() {
    let color = this.settings.attributes.color;
    if (color.includes('light')) {
      color = color.replace('light', 'dark');
    } else {
      color = color.replace('dark', 'light');
    }
    this.updateAttribute('color', color);
  }

  _onPinButtonClick() {
    let behaviour = this.settings.attributes.behaviour;
    if (behaviour === 'pinned') {
      behaviour = 'unpinned';
    } else {
      behaviour = 'pinned';
    }
    this.updateAttribute('behaviour', behaviour);
  }

  updateAttribute(id, value) {
    if (id === 'color') {
      this.settings.carryParams = false;
    }
    if (this.settings.attributes[id] !== value) {
      this.settings.attributes[id] = value;
      localStorage.setItem(this.settings.storagePrefix + id, value);
      this._setActiveOptions();
      if (this.attributeOptions[id].update) {
        document.documentElement.setAttribute(this.attributeOptions[id].attribute, value);
      }
      if (this.attributeOptions[id].event) {
        document.documentElement.dispatchEvent(new CustomEvent(this.attributeOptions[id].event, {detail: value}));
      }
    }
  }

  getAttribute(attribute) {
    return this.settings.attributes[attribute];
  }
}

В первом плагине клиент делает настройку и кастомизацию аудио плеера на сайта.

Второй:

class Settings {
  get options() {
      return {
      attributes: {
        placement: 'vertical',
        behaviour: 'pinned',
        layout: 'fluid',
        radius: 'rounded',
        color: 'light-blue',
        shadow: 'min',
        butcolor: 'orchid',
        colorcard: 'c-medium-purple',
        navcolor: 'default',
      },
      storagePrefix: 'acorn-standard-',
      showSettings: true,
      carryParams: false,
    };
  }

  constructor(options = {}) {
    this.settings = Object.assign(this.options, options);
    this.settings.attributes = Object.assign(this.options.attributes, options.attributes);

    this.attributeOptions = {
      placement: {
        event: Globals.menuPlacementChange,
        update: false,
        attribute: 'data-placement',
      },
      behaviour: {
        event: Globals.menuBehaviourChange,
        update: false,
        attribute: 'data-behaviour',
      },
      layout: {
        event: Globals.layoutChange,
        update: true,
        attribute: 'data-layout',
      },
      radius: {
        event: Globals.borderRadiusChange,
        update: true,
        attribute: 'data-radius',
      },
      color: {
        event: Globals.colorAttributeChange,
        update: true,
        attribute: 'data-color',
      },
      shadow: {
        event: Globals.shadowChange,
        update: true,
        attribute: 'data-shadow',
      },
      butcolor: {
        event: Globals.butcolorChange,
        update: true,
        attribute: 'data-butcolor',
      },
      colorcard: {
        event: Globals.colorcardChange,
        update: true,
        attribute: 'data-colorcard',
      },
      navcolor: {
        event: null,
        update: true,
        attribute: 'data-navcolor',
      },
    };
    this.optionSelector = '#settings .option';
    this._init();
  }

  _init() {
    this._mergeOverridePrefix();
    this._mergeAttributesFromStorage();
    this._mergeOverrides();
    this._mergeUrlParameters();
    this._modifyLinksCarryParams();
    this._setAttributes();
    this._setActiveOptions();
    this._addListeners();
    this._setVisibility();
  }

  _mergeAttributesFromStorage() {
    for (const prop in this.settings.attributes) {
      if (localStorage.getItem(this.settings.storagePrefix + prop)) {
        this.settings.attributes[prop] = localStorage.getItem(this.settings.storagePrefix + prop);
      } else {
        localStorage.setItem(this.settings.storagePrefix + prop, this.settings.attributes[prop]);
      }
    }
  }

  _mergeOverrides() {
    const overrideJSON = this._getOverrideJSON();
    if (!overrideJSON) {
      return;
    }
    const overridedAttributes = Object.assign(this.settings.attributes, overrideJSON.attributes);
    this.settings = Object.assign(this.settings, overrideJSON);
    this.settings.attributes = overridedAttributes;
  }

  _mergeOverridePrefix() {
    const overrideJSON = this._getOverrideJSON();
    if (!overrideJSON) {
      return;
    }
    if (overrideJSON.storagePrefix) {
      this.settings.storagePrefix = overrideJSON.storagePrefix;
    }
  }

  _getOverrideJSON() {
    const override = document.documentElement.getAttribute('data-override');
    if (!override) {
      return null;
    }
    const overrideJSON = JSON.parse(override);
    return overrideJSON;
  }

  _mergeUrlParameters() {
    const queryString = window.location.search;
    const urlParamsDecoded = decodeURIComponent(queryString);
    const urlParams = new URLSearchParams(urlParamsDecoded);
    const urlJSON = JSON.parse(urlParams.get('params'));
    if (urlJSON && urlJSON.attributes) {
      const overridedAttributes = Object.assign(this.settings.attributes, urlJSON.attributes);
      this.settings = Object.assign(this.settings, urlJSON);
      this.settings.attributes = overridedAttributes;
    }
  }

  _modifyLinksCarryParams() {
    const queryString = window.location.search;
    if (queryString !== '') {
      document.addEventListener('click', (event) => {
        if (!this.settings.carryParams) {
          return;
        }
        const closestAnchor = event.target.closest('a');
        if (closestAnchor && !closestAnchor.getAttribute('href').includes('#')) {
          const queryString = window.location.search;
          document.location = closestAnchor.getAttribute('href') + queryString;
        }
        event.preventDefault();
      });
    }
  }

  _setAttributes() {
    for (const prop in this.settings.attributes) {
      document.documentElement.setAttribute(this.attributeOptions[prop].attribute, this.settings.attributes[prop]);
    }
  }

  _setActiveOptions() {
    this._clearActiveOptions();
    document.querySelectorAll(this.optionSelector).forEach((el, i) => {
      if (el.dataset.value === this.settings.attributes[el.dataset.parent]) {
        el.classList.add('active');
      }
    });
  }

  _clearActiveOptions() {
    document.querySelectorAll(this.optionSelector).forEach((el, i) => {
      el.classList.remove('active');
    });
  }

  _addListeners() {
    document.querySelectorAll(this.optionSelector).forEach((el, i) => {
      el.addEventListener('click', this._onOptionClick.bind(this));
    });
    document.documentElement.addEventListener(Globals.lightDarkModeClick, this._onLightDarkModeClick.bind(this));
    document.documentElement.addEventListener(Globals.pinButtonClick, this._onPinButtonClick.bind(this));
  }

  _onOptionClick(event) {
    event.preventDefault();
    const clickedEl = event.currentTarget;
    const clickedVal = clickedEl.dataset.value;
    const parentId = clickedEl.dataset.parent;
    this.updateAttribute(parentId, clickedVal);
  }

  _setVisibility() {
    if (!this.settings.showSettings) {
      document.getElementById('settings') && document.getElementById('settings').classList.add('d-none');
      document.getElementById('settingsButton') && document.getElementById('settingsButton').classList.add('d-none');
    }
  }

  _onLightDarkModeClick() {
    let color = this.settings.attributes.color;
    if (color.includes('light')) {
      color = color.replace('light', 'dark');
    } else {
      color = color.replace('dark', 'light');
    }
    this.updateAttribute('color', color);
  }

  _onPinButtonClick() {
    let behaviour = this.settings.attributes.behaviour;
    if (behaviour === 'pinned') {
      behaviour = 'unpinned';
    } else {
      behaviour = 'pinned';
    }
    this.updateAttribute('behaviour', behaviour);
  }

  updateAttribute(id, value) {
    if (id === 'color') {
      this.settings.carryParams = false;
    }
    if (this.settings.attributes[id] !== value) {
      this.settings.attributes[id] = value;
      localStorage.setItem(this.settings.storagePrefix + id, value);
      this._setActiveOptions();
      if (this.attributeOptions[id].update) {
        document.documentElement.setAttribute(this.attributeOptions[id].attribute, value);
      }
      if (this.attributeOptions[id].event) {
        document.documentElement.dispatchEvent(new CustomEvent(this.attributeOptions[id].event, {detail: value}));
      }
    }
  }

  getAttribute(attribute) {
    return this.settings.attributes[attribute];
  }
}

Во втором плагине идет настройка самого сайта например: Расположение блоков, цветовые схемы, цвет кнопок и т.д. Но есть один изъян, я не могу понять почему они конфликтую между собой, эти файлы лежать не с друг с другом, они даже не подключены в тело HEAD, они подключаются через админ панель. Я грешу на class Settings {, но когда я меняю у одного из плагинов класс, один начинает работать, другой нет, или наоборот.