JavaScript Plugin im Theme überschreiben

Shopware 6 (German)
, ,
1

Hallo liebe Community,

ich würde gern ein JavaScript Plugin überschreiben im Theme. Ich bin dazu wie in der Doku beschrieben vorgegangen: Override existing Javascript - Shopware Developer

Im Theme habe ich also unter /src/Resources/app/storefront/src/NEUES-PLUGIN einen neuen Ordner angelegt und hier möchte ich das Plugin überschreiben. Die entsprechende Datei habe ich ebenfalls angelegt und das Plugin welches ich überschreiben möchte importiert und alles gemacht wie in der Doku.

Am Ende habe ich das ganze dann in der main.js überschrieben. Das sieht dann so aus:

import CollapseFooterColumnsChange from './collapse-footer-columns-change/collapse-footer-columns-change.plugin';

const PluginManager = window.PluginManager;
PluginManager.override('CollapseFooterColumns', CollapseFooterColumnsChange, '[data-collapse-footer]');

// Necessary for the webpack hot module reloading server
if (module.hot) {
    module.hot.accept();
}

Das Plugin selbst sieht so aus:

import CollapseFooterColumnsPlugin from 'src/plugin/collapse/collapse-footer-columns.plugin';
import ViewportDetection from 'src/helper/viewport-detection.helper';


export default class CollapseFooterColumnsChange extends CollapseFooterColumnsPlugin {

    init() {
        console.log('test');
        super.init();
    }

    /**
     * Returns if the browser is in the allowed viewports
     * @returns {boolean}
     * @private
     */
    _isInAllowedViewports() {
        return (ViewportDetection.isXS() || ViewportDetection.isSM() || ViewportDetection.isMD());
    }
}

Der Code kommt leider überhaupt nicht an. Ich glaube es wird gar nicht geladen, da ich in der Konsole auch nicht „test“ stehen habe. ./psh.phar storefront:build habe ich ebenfalls ausgeführt aber das Problem ist immer noch dasselbe. Habe ich etwas übersehen? Hat jemand eine Idee oder einen Tipp?

2

Hat niemand eine Ahnung warum nicht mal der console.log ankommt?

3

Der Beitrag ist leider schon sehr alt, aber falls jemand auf das selbe Problem stoßen sollte:

Es sieht alles gut so aus, aber m. A. nach fehlt die Dateiendung beim Import:

Statt:

import CollapseFooterColumnsChange from './collapse-footer-columns-change/collapse-footer-columns-change.plugin';

So:

import CollapseFooterColumnsChange from './collapse-footer-columns-change/collapse-footer-columns-change.plugin.js';

LG