Overview:

Nuxt-Mapbox is a library that provides an elegant integration of Mapbox into Nuxt applications. It allows users to easily add Mapbox to their Nuxt app using Vue components. With Nuxt-Mapbox, users can create custom components, define markers and popups, and even create their own controls. It also allows for persistent map instances across routes.

Features:

• Easily add Mapbox to your Nuxt app with Vue components
• useMapbox Composable for easy access
• defineMapboxMarker & defineMapboxPopup for making custom components
• defineMapboxControl for creating your own controls
• Persistent map instances across routes

Installation:

To install Nuxt-Mapbox, follow these steps:

1. Add the nuxt-mapbox and mapbox-gl dependencies to your project.

npm install nuxt-mapbox mapbox-gl

2. Add nuxt-mapbox to the modules section of your nuxt.config.ts file.

{
  modules: [
    'nuxt-mapbox',
  ],
}

3. Add your Mapbox API key to the mapbox section of your nuxt.config.ts file.

{
  mapbox: {
    accessToken: 'YOUR_MAPBOX_ACCESS_TOKEN',
  },
}

Summary:

Nuxt-Mapbox is a powerful integration of Mapbox into Nuxt applications. It provides easy-to-use Vue components for adding Mapbox functionality to your app and allows for customization through options like markers, popups, and controls. With the ability to create persistent map instances across routes, Nuxt-Mapbox offers a seamless and efficient way to incorporate maps into your Nuxt projects.