Overwrite an existing plugin JS in Shopware 6

Question

I am currently trying to overwrite a javascript file from an existing plugin.

I've been following the documentation but I am struggling with the path for the JS class to overwrite.

In the docs is an example code:

import CookiePermissionPlugin from 'src/plugin/cookie/cookie-permission.plugin';

export default class MyCookiePermission extends CookiePermissionPlugin {
}

So I implemented the following code:

import QuantityField from 'src/plugin/FilterRangeSlider/filter-range-slider.plugin';

export default class ExampleQuantityField extends QuantityField {

This code does not work for me, since the original file is in the vendor directory and my plugin is in the custom directory. When trying to compile (eg bin/build-storefront.sh) I receive the following error message:

Module not found: Error: Can't resolve 'src/plugin/FilterRangeSlider/filter-range-slider.plugin' in '<project root>/custom/plugins/ExampleProductFilter/src/Resources/app/storefront/src/filter-range-slider'

Any idea how I can import that class as stated in the docs?

Answer 1

Node.js provides a bunch of in-built file-system functionalities. The __dirname points to the root directory.

So, this should work.

import QuantityField from `${__dirname}/vendor/store.shopware.com/mmeesrangesliderpro/src/Resources/app/storefront/src/script/filter-range-slider.plugin`

Answer 2

My current solution is not really clean...

import QuantityField from '../../../../../../../../../vendor/store.shopware.com/mmeesrangesliderpro/src/Resources/app/storefront/src/script/filter-range-slider.plugin';

Isnt there any plugin root variable or something similar?