如何在VueJS项目中使用leaflet-semicircle和vue2-leaflet？

npm install vue
npm install vue2-leaflet

npm install leaflet-semicircle

<template>
  <div>
    <l-map :zoom="zoom" :center="center">
      <l-tile-layer :url="url"></l-tile-layer>
      <l-semicircle :lat-lng="latLng" :radius="radius"></l-semicircle>
    </l-map>
  </div>
</template>

<script>
import { LMap, LTileLayer, LSemicircle } from 'vue2-leaflet';
import 'leaflet-semicircle';

export default {
  components: {
    LMap,
    LTileLayer,
    LSemicircle,
  },
  data() {
    return {
      zoom: 13,
      center: [51.505, -0.09],
      url: 'https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',
      latLng: [51.505, -0.09],
      radius: 1000,
    };
  },
};
</script>

<template>
  <div id="app">
    <Map></Map>
  </div>
</template>

<script>
import Map from './components/Map.vue';

export default {
  components: {
    Map,
  },
};
</script>