My ionic 3 app uses leaflet and leaflet search. The css refer to images using relative paths:
background-image: url(images/layers.png)
and
background:url(../images/loader.gif)
What works so far is using a custom copy.config.js to copy the files and linking them in index.html:
copyLeaflet: {
src: [ '{{ROOT}}/node_modules/leaflet/dist/**/*' ],
dest: '{{BUILD}}/leaflet'
},
copyLeafletSearchImages: {
src: [ '{{ROOT}}/node_modules/leaflet-search/images/*' ],
dest: '{{BUILD}}/leaflet-search/images'
},
copyLeafletSearchCss: {
src: [ '{{ROOT}}/node_modules/leaflet-search/dist/leaflet-search.min.css' ],
dest: '{{BUILD}}/leaflet-search/dist'
}
I’m wondering if there’s a more eloquent solution using sass.config or webpack.config. I was able to @import the css without any problem using either saas include paths or webpack loaders, but the images don’t work. I’ve experimented with file-loader, url-loader, and relative-url-loader to no avail.