Nuxt Maplibre
一个用于使用 MapLibre 的 Nuxt 模块。它是使用 vue-maplibre-gl 创建的,后者是 MapLibre 的 Vue 3 包装器,它将原始 MapLibre API 作为 Vue 组件公开。
这个模块实际上只是为了让它在 Nuxt 中工作而无需任何配置。
特性
- ⚡ 无需配置
- 🦺 TypeScript 支持
- 🚠 自动导入
快速设置
npx nuxi@latest module add nuxt-maplibre
就是这样!您现在可以在您的 Nuxt 应用中使用 MapLibre ✨
用法
有关可用组件的完整列表,请查看 vue-maplibre-gl 文档。
基础
<template>
<MglMap
:map-style="style"
:center="center"
:zoom="zoom"
>
<MglNavigationControl />
</MglMap>
</template>
<script setup>
const style = 'https://api.maptiler.com/maps/streets/style.json?key=cQX2iET1gmOW38bedbUh';
const center = [-1.559482, 47.21322];
const zoom = 8;
</script>
开发
# Install dependencies
npm install
# Generate type stubs
npm run dev:prepare
# Develop with the playground
npm run dev
# Build the playground
npm run dev:build
# Run ESLint
npm run lint
# Run Vitest
npm run test
npm run test:watch
# Release new version
npm run release