---
title: "安装"
description: "安装 @movk/maplibre 及其 peer 依赖，并按 Nuxt 或 Vue + Vite 选择接入方式。"
canonical_url: "https://maplibre.mhaibaraai.cn/docs/getting-started/installation"
---
# 安装

> 安装 @movk/maplibre 及其 peer 依赖，并按 Nuxt 或 Vue + Vite 选择接入方式。

## 环境要求

> [!NOTE]
> 
> - **MapLibre GL JS** —— v6（`maplibre-gl` 作为 peer 依赖）
> - **Vue** —— 3.4+
> - **Node.js** —— `^20.19.0 || >=22.12.0`
> - MapLibre 本身**无需 access token**；如需天地图底图，另需天地图 `tk`

## 安装依赖

```bash [pnpm]
pnpm add @movk/maplibre maplibre-gl
```

```bash [npm]
npm install @movk/maplibre maplibre-gl
```

```bash [yarn]
yarn add @movk/maplibre maplibre-gl
```

需要绘制能力（`MaplibreDrawControl`）时，额外安装：

```bash [pnpm]
pnpm add terra-draw terra-draw-maplibre-gl-adapter
```

```bash [npm]
npm install terra-draw terra-draw-maplibre-gl-adapter
```

```bash [yarn]
yarn add terra-draw terra-draw-maplibre-gl-adapter
```

其他可选依赖按需安装，未安装时不影响其余功能：

| 依赖 | 用途 |
| --- | --- |
| `pmtiles` | [PMTiles](https://maplibre.mhaibaraai.cn/docs/extensions/pmtiles) 单文件瓦片协议 |
| `@geomatico/maplibre-cog-protocol` | [COG](https://maplibre.mhaibaraai.cn/docs/extensions/cog) 云优化 GeoTIFF 协议 |
| `maplibre-contour` | [MaplibreContourLayer](https://maplibre.mhaibaraai.cn/docs/layers/contour) 实时等高线 |
| `lottie-web` | [MaplibreLottieMarker](https://maplibre.mhaibaraai.cn/docs/core/lottie-marker) 动画标记 |

## 选择接入方式

[**Nuxt 4**](https://maplibre.mhaibaraai.cn/docs/getting-started/nuxt)

作为 Nuxt 模块注册，组件与 composables 自动导入。

[**Vue + Vite**](https://maplibre.mhaibaraai.cn/docs/getting-started/vue)

经 Vite 插件 + vue-plugin，在纯 Vue 项目中使用同一套组件。


## Sitemap

See the full [sitemap](https://maplibre.mhaibaraai.cn/sitemap.md) for all pages.