Within a TYPO3 12 website I use the Sitepackagebuilder to create a sitepackage.
The Resources are structured as following:
Resources
...
Public
JavaScript
scripts.js
Icons
arrow.png
...
Within my scripts.js I would like to access an icon from the Icons-folder (arrow.png) to use it with the slick slider as follows:
$slider.slick({
infinite: true,
slidesToShow: 3,
arrows: true,
// Does not work due to script compression:
prevArrow: "<button class='slick-prev slick-arrow' aria-label='Previous' type='button'><img src='../Icons/arrow.png'></button>",
// I would like to access it like this (but it does not work):
prevArrow: "<button class='slick-prev slick-arrow' aria-label='Previous' type='button'><img src='EXT:sitepackage/Resources/Public/Icons/slider-left.png'></button>",
// Using the icon from fileadmin does work:
prevArrow: "<button class='slick-prev slick-arrow' aria-label='Previous' type='button'><img src='fileadmin/Icons/slider-left.png'></button>",
});
Does anybody know how to use an image ressources from the sitepackage within javascript in TYPO3?