{"_id":"@anktx/vue-leaflet","name":"@anktx/vue-leaflet","dist-tags":{"latest":"0.6.1"},"versions":{"0.6.1":{"name":"@anktx/vue-leaflet","author":{"name":"Nicolò Maria Mezzopera"},"version":"0.6.1","license":"MIT","private":false,"sideEffects":false,"main":"dist/vue-leaflet.cjs.js","unpkg":"dist/vue-leaflet.umd.js","module":"dist/vue-leaflet.esm.js","repository":{"type":"git","url":"git+ssh://git@github.com/anktx/vue-leaflet.git"},"scripts":{"serve":"vue-cli-service serve ./src/playground/index.js","build":"rollup -c rollup.config.js","lint":"vue-cli-service lint","prepublishOnly":"npm run lint && npm run build","postversion":"git push --follow-tags","docs:dev":"vitepress dev docs","docs:build":"vitepress build docs"},"peerDependencies":{"@types/leaflet":"^1.5.7","leaflet":"^1.6.0","vue":"^3.0.0"},"devDependencies":{"@vue/cli-plugin-babel":"~4.5.0","@vue/cli-plugin-eslint":"~4.5.0","@vue/cli-service":"~4.5.0","@vue/compiler-sfc":"^3.0.0","babel-eslint":"^10.1.0","eslint":"^6.7.2","eslint-config-prettier":"^6.11.0","eslint-plugin-prettier":"^3.1.4","eslint-plugin-vue":"^7.0.0-0","husky":"^4.3.0","leaflet":"^1.6.0","lint-staged":"^10.4.0","prettier":"^2.0.5","rollup":"^2.8.0","rollup-plugin-commonjs":"^10.1.0","rollup-plugin-vue":"^6.0.0-beta.11","vitepress":"^0.6.0","vue":"^3.0.0","vue-router":"^4.0.0-rc.5"},"husky":{"hooks":{"pre-commit":"lint-staged"}},"lint-staged":{"*.js":["eslint","git add"],"*.vue":["eslint","git add"]},"eslintConfig":{"root":true,"env":{"node":true},"extends":["plugin:vue/vue3-essential","plugin:prettier/recommended","eslint:recommended"],"parserOptions":{"parser":"babel-eslint"},"rules":{}},"publishConfig":{"access":"public","registry":"https://registry.npmjs.org/"},"gitHead":"461980c27c3ebbce2d394d06b366ccd8b0d10051","description":"Vue-leaflet, written and compatible with Vue 3!","bugs":{"url":"https://github.com/anktx/vue-leaflet/issues"},"homepage":"https://github.com/anktx/vue-leaflet#readme","_id":"@anktx/vue-leaflet@0.6.1","_nodeVersion":"12.22.12","_npmVersion":"6.14.16","dist":{"integrity":"sha512-qex6HCtp1+dY8FsrYm+RarSoejE7wdIq8XIWGsiTY7nZHhzjHrdPgDSj1PHQTAg2NtgMh1dtRnf/LGXPYYzbHA==","shasum":"cff2c25e9660d7a2d0fd2faaeb0db30072c636a1","tarball":"https://registry.npmjs.org/@anktx/vue-leaflet/-/vue-leaflet-0.6.1.tgz","fileCount":83,"unpackedSize":735104,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCGiN9YwsbCMH0DVnlIiagNZ+HKsBK2ndUN1tqc5FPL6wIgLRREGeaREHwIV3pHOlkdnecs7zlIli2LKkXjEEFWbz8="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJikhJTACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmqQfQ/9H9NolOhrgtk77f14k87O9kiX3NBO9H+a3eSW5COi6Cm+EXBV\r\nGtBRWWLc0P8KusaCUbpIQ4qbk0Y/AjiXs2qwqrHgKtCrwGaOFPxD5Ti+5njU\r\nzQjybiqiS9hTaELrBLIIXW909k6fmnTNsSckVCOm+58NUcYdLQIdL1AqUKUT\r\n8phwuNT8lGBdEzoYSb0Kdyh7gg2vWogh/nIWQC9ztJiRIm2mCoSya01ZUc+6\r\nKCaTRpQXH4FlT7MXH5PHzf0XRYy+m85/xpPlCgQ0TRoJ6DsNgfBaW9dftudl\r\norRI9gnhyzElLlNsQ7OTs1BXVuAq03JEcQiiUD9ZUmx0DbYAiGzSUhlW4Mnq\r\nImNMZsQ6fnPRrccS5sZ5WE4k6eUAyad+wUfkX5iigigHpnW1ls3H8P79/Yjv\r\nJUm+m1qY9SKWXTpkNAVHvtLsN9XflDPpVXJInmS53f5/1+wlbI1Qo5xAfWNS\r\nUkNuyzcjQgga71lYC06nDhL40L7Eo2Is3fbb7lHZxmWdKKA4Dbw4vPhMu3B5\r\ng5U61q7Ubff4sbNwhPwxRLYzDiW1DsgcSrw1R6wlFlVp2gd4c9oPVzKQVmua\r\n01AOl/6ZeBcRDtJ39Sx/x+BR2nq4R995MUOI1an24oovjjNclOuZblZUFOi7\r\niv8YEU+uc/nMcgLrJBhlAQ4luY61VfbLanY=\r\n=59F2\r\n-----END PGP SIGNATURE-----\r\n"},"_npmUser":{"name":"anktx","email":"npmjs@anom.ru"},"directories":{},"maintainers":[{"name":"anktx","email":"npmjs@anom.ru"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue-leaflet_0.6.1_1653740115655_0.429555866326615"},"_hasShrinkwrap":false}},"time":{"created":"2022-05-28T12:15:15.605Z","0.6.1":"2022-05-28T12:15:15.846Z","modified":"2022-05-28T12:15:15.949Z"},"maintainers":[{"name":"anktx","email":"npmjs@anom.ru"}],"description":"Vue-leaflet, written and compatible with Vue 3!","homepage":"https://github.com/anktx/vue-leaflet#readme","repository":{"type":"git","url":"git+ssh://git@github.com/anktx/vue-leaflet.git"},"author":{"name":"Nicolò Maria Mezzopera"},"bugs":{"url":"https://github.com/anktx/vue-leaflet/issues"},"license":"MIT","readme":"# vue-leaflet\n\nVue-leaflet, written and compatible with Vue 3!\n\nThis is a Beta version! And may yet be unstable! If you want to help, please reach out in an\n[issue](https://github.com/vue-leaflet/vue-leaflet/issues) or on [discord](https://discord.gg/uVZAfUf),\nor join the [discussions](https://github.com/vue-leaflet/vue-leaflet/discussions).\n\n## What Works:\n\n- LCircle\n- LCircleMarker\n- LControl\n- LControlAttribution\n- LControlLayers\n- LControlScale\n- LControlZoom\n- LFeatureGroup\n- LGeoJson\n- LIcon\n- LImageOverlay\n- LMap\n- LMarker\n- LPolygon\n- LPolyline\n- LPopup\n- LRectangle\n- LTileLayer\n- LTooltip\n- LWmsTileLayer\n\n> Note that unlike the [Vue 2 version](https://github.com/vue-leaflet/Vue2Leaflet), this library is fully compatible with SSR.\n\n## Installation\n\n`yarn add @vue-leaflet/vue-leaflet`\n\nor\n\n`npm i -D @vue-leaflet/vue-leaflet`\n\n## Usage\n\nUntil the complete documentation is ready, please check the\n[component playground](https://github.com/vue-leaflet/vue-leaflet/tree/master/src/playground/views) examples or the\n[demo project](https://github.com/vue-leaflet/vue3-demo-project/blob/master/src/App.vue) for usage with Vue 3.\nMost component props mimic the vanilla [Leaflet options](https://leafletjs.com/reference-1.7.1.html) as closely as\npossible, and generally remain the same as in their [Vue2Leaflet counterparts](https://vue2-leaflet.netlify.app/components/).\n\n### Working with Leaflet\n\n> **N.B.** Using `import L from \"leaflet\"` or `import { ... } from \"leaflet\"` can lead to unexpected errors.\n\nTo provide server-side rendering and tree-shaking capabilities, vue-leaflet uses async imports from the Leaflet ESM.\nThis can lead to issues when importing additional methods from Leaflet, because the two instances of the Leaflet\nclasses are technically no longer the same. See [Issue 48](https://github.com/vue-leaflet/vue-leaflet/issues/48) for more.\n\nTo avoid these issues, import any Leaflet methods asynchronously in response to the LMap component's `@ready` event:\n```vue\n<template>\n  <l-map style=\"height:50vh\">\n    <l-geo-json :geojson=\"geojson\" :options=\"geojsonOptions\" />\n  </l-map>\n</template>\n\n<script>\n// DON'T load Leaflet components here!\n// Its CSS is needed though, if not imported elsewhere in your application.\nimport \"leaflet/dist/leaflet.css\"\nimport { LMap, LGeoJson } from \"@vue-leaflet/vue-leaflet\";\n\nexport default {\n  components: {\n    LMap,\n    LGeoJson,\n  },\n  data() {\n    return {\n      geojson: {\n        type: \"FeatureCollection\",\n        features: [\n          // ...\n        ],\n      },\n      geojsonOptions: {\n        // Options that don't rely on Leaflet methods.\n      },\n    };\n  },\n  async beforeMount() {\n    // HERE is where to load Leaflet components!\n    const { circleMarker } = await import(\"leaflet/dist/leaflet-src.esm\");\n\n    // And now the Leaflet circleMarker function can be used by the options:\n    this.geojsonOptions.pointToLayer = (feature, latLng) =>\n      circleMarker(latLng, { radius: 8 });\n    this.mapIsReady = true;\n  },\n};\n</script>\n```\n","readmeFilename":"README.md"}