Vue2leaflet: Should leaflet be installed when using Vue2Leaflet?

[kissmygritts]

This isn't necessarily clear in the readme. However when looking at the JSFiddle demo it is included as an external resource.

[EmmanuelBeziat]

Same question here, but I assume this is because you can’t load node_modules in JSFiddle.

[KoRiGaN]

Hi @kissmygritts and @EmmanuelBeziat,

If you are using npm it will detect Leaflet as a dependency and download it.
If you are not using npm then you have to include yourself as a script tag as in the JSFiddle example.

This repo is not replacing Leaflet. It's just a wrapper around Leafet to make it easy to use with Vue.

Hope this helps,

Cheers,

Mickaël

[goforward01]

Hi, @KoRiGaN. Thanks for all the amazing works. I did install the Vue2Leaflet by: npm install vue2-leaflet --save, and then I created my demo map component with the help of vue-cli. but well, without luck, It gave me one error while I ran: npm run dev. 'L' is not defined(L could be found at codes below), It seems like that it couldn't find Leaflet module. I am confused about whether I should add the source file of leaflet in my HTML file first or not.
Codes below are from my map component file. If I had done anything wrong, tell me please, thx.

<template>
    <div id="app" style="height: 100%">
        <v-map :zoom="zoom" :center="center">
            <v-tilelayer :url="url" :attribution="attribution"></v-tilelayer>
            <v-marker :lat-lng="marker"></v-marker>
        </v-map>
    </div>
</template>

<script>
  import Vue2Leaflet from 'vue2-leaflet';

  export default {
    data() {
      return {
        zoom: 16,
        center: [30.2792953, 120.1198430],
        url: 'http://{s}.tile.osm.org/{z}/{x}/{y}.png',
        attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
        marker: L.latLng(30.2792953, 120.1198430)
      }
    },
    components: {
      'v-map': Vue2Leaflet.Map,
      'v-tilelayer': Vue2Leaflet.TileLayer,
      'v-marker': Vue2Leaflet.Marker
    }
  }
</script>

[KoRiGaN]

Hi @goforward01,

You use L but it's not defined. import L first.
import L from 'leaflet';

Mickael

[goforward01]

@KoRiGaN Thanks for answering quickly. What a silly question I asked, thanks again for your time.