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