webpack + leaflet plugin(s)

user_5298800 0
Viewed 753

I have a requireJs-based library, that exports object T, which holds Leaflet object L. And I have a Leaflet plugin (this, in my case, but valid for any other), which adds some functions to the global object L. And I have my module, where I want to use object T with extended L. Question: how to gracefully do it with Webpack? I could modify the plugin, to import L from the first library, but anyway don't understand how to plug it in to my module. And not sure that this is the best way.

P.S. I saw this thread, and this as well, but didn't find a good way there. I don't want to use additional < script> tags, and this is quite rambled to have statements like this:

import 'my.leflet.library';
import 'leaflet.plugin';

somewhere in the source - instead, I would prefer to add something to the configuration, that will extend L object right after 'my.leaflet.library' would be loaded, and any module, that would import 'my.leaflet.library' will have T with modified L. Is it possible?

leaflet webpack javascript
1 Answers

This is my webpack config for Vue (vue.config.js), you can probably adapt it for your needs.

const webpack = require('webpack')

module.exports = {
  configureWebpack: {
    plugins: [
      new webpack.ProvidePlugin({
        L: 'leaflet',
        'window.L': 'leaflet',
      })
    ],
  }
}
user_2285080
Related