Problem/Motivation
It looks like aggregating several JavaScript files can cause a conflict in the name space, as was seen in #3410672: Multilayer map breaks with JavaScript aggregation when using Maplibre libraries, which this issue is based on:
After Leaflet 10.2.6 where maplibre-gl-js & maplibre-gl-leaflet libraries js and css files was embedded in the Leaflet module itself, if you use the Maplibre libraries for example for Vector tiles, and you aggregate JavaScript files, you get a white page, and this message in the console:
Uncaught SyntaxError: redeclaration of const a note: Previously declared at line 585, column 124988 js_36Cc25ySfc_bCPZPMGkgRO6_2OjFQNpZD9P35kGaiS8.js:585:125091 js_36Cc25ySfc_bCPZPMGkgRO6_2OjFQNpZD9P35kGaiS8.js:585:124988
Steps to reproduce
NOTE: This issue was resolved in the Leaflet module version 10.2.7 by excluding the maplibre-gl.js from aggregation.
To replicate the problem:
- Make the module always load the problematic Maplibre GL library, by changing this line:
$attached_libraries = ['leaflet/general', 'leaflet/leaflet-drupal'];
To this:$attached_libraries = ['leaflet/general', 'leaflet/leaflet-drupal', 'leaflet/maplibre-gl-leaflet'];
https://git.drupalcode.org/project/leaflet/-/blob/10.2.x/src/LeafletServ... - To force aggregating the Maplibre library, remove
{ preprocess: false }
https://git.drupalcode.org/project/leaflet/-/commit/3bd02997151a551f293a...
... and then:
- Add a Geofield to a content type, and use Leaflet to show the map
- Toggle JavaScript aggregation
- See that the map doesn't render with aggregation enabled
Proposed resolution
Figure out how to allow aggregating all JavaScript files.