nuxt-leaflet
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.25 • Public • Published

    nuxt-leaflet

    npm (scoped with tag) npm Dependencies js-standard-style

    Nuxt module for leafletjs

    📖 Release Notes

    Features

    Nuxt module for vue2-leaflet.

    See vue2-leaflet for more details.

    Setup

    • Add nuxt-leaflet dependency using yarn or npm to your project
    • Add nuxt-leaflet to modules section of nuxt.config.js
    {
      modules: [
        // Simple usage
        'nuxt-leaflet',
    
        // With options
        ['nuxt-leaflet', { /* module options */ }],
     ]
    }

    Usage

    Add the map to your page

    <div id="map-wrap" style="height: 100vh">
     <no-ssr>
       <l-map :zoom=13 :center="[55.9464418,8.1277591]">
         <l-tile-layer url="http://{s}.tile.osm.org/{z}/{x}/{y}.png"></l-tile-layer>
         <l-marker :lat-lng="[55.9464418,8.1277591]"></l-marker>
       </l-map>
     </no-ssr>
    </div>

    The Leaflet 'L' object can be found on vue component: this.$L

    Typescript

    If you're using TypeScript, you'll need to add nuxt-leaflet in your compilerOptions of your tsconfig.json :

    {
      "compilerOptions": {
        "types": [
          "@types/node",
          "@nuxt/vue-app",
          "nuxt-leaflet"
        ]
      }
    }

    You'll then be able to have autocompletion in Vue instances (this.$L).

    List of currently implemented components

    See components supported

    Development

    • Clone this repository
    • Install dependencies using yarn install or npm install
    • Start development server using npm run dev

    License

    MIT License

    Copyright (c) Rasmus Schlunsen

    Keywords

    none

    Install

    npm i nuxt-leaflet

    DownloadsWeekly Downloads

    4,773

    Version

    0.0.25

    License

    MIT

    Unpacked Size

    8.46 kB

    Total Files

    7

    Last publish

    Collaborators

    • schlunsen