I'm using two different versions of Leaflet in the same project.
For this i installed the latest version of leaflet using an alias ("leaflet-latest"). After importing the library, i use the noConflict function to use both versions.
"L" keyword is used for an old version of Leaflet and "Leaflet" keyword is used for the latest version.
import L from "leaflet-latest";
import "leaflet-hotline";
var Leaflet = L.noConflict();
// L.hotline is defined
// Leaflet.hotline undefined (is not a function)
Everything is working well except when i want to use a plugin with the latest version. Here, i wanted to use the "leaflet-hotline" plugin but when i import it, it extends the global variable L and not "Leaflet".
Any suggestions on how to extend Leaflet and not L?
I tried to solve the problem using this code but it's not a good approach.
import L from "leaflet-latest";
import "leaflet-latest/dist/leaflet.css";
import L_Hotline from "leaflet-hotline";
var Leaflet = L.noConflict();
Leaflet.hotline = L_Hotline.hotline;
In this case, the Leaflet hotline doesn't extends from the good library.
From the docu:
// Pass Leaflet to the plugin.
// Only required to overload once, subsequent overloads will return the same instance.
require('leaflet-hotline')(L);
So it should work like that:
import L from "leaflet-latest";
import "leaflet-latest/dist/leaflet.css";
var Leaflet = L.noConflict();
require('leaflet-hotline')(Leaflet);