Setup

Learn how to setup atoms locator module in your Nuxt 3 application.

Check out the Nuxt 3 documentation for more information about installing and using modules.

Installation

Add @atoms-studio/atoms-locator dependency to your project:

yarn
yarn add @atoms-studio/atoms-locator
npm
npm install @atoms-studio/atoms-locator

Then, add @atoms-studio/atoms-locator to the modules section of your Nuxt configuration:

nuxt.config.js|ts
export default {  modules: ['@atoms-studio/atoms-locator'],  atomsLocator: {    // Options  }}

Options

Defaults:

{  key: process.env.GOOGLE_API_KEY || 'google_api_key',  markerIcon: '',  activeMarkerIcon: '',  clustererIcon: '',  autoImports: false}

key

Google Maps Api key.

Environment variable GOOGLE_API_KEY can be used to override key.

markerIcon

Provide the path for the Google Marker icon.

activeMarkerIcon

Provide the path for the Google Marker active icon.

clustererIcon

Provide the path for the Google Clusterer icon.

autoImports

Automatic injection of a Pinia store with some utilities and methods for easy implementation of a store locator project.

If you set autoImports: true check your nuxt.config.ts. Probably, Pinia is included in your modules array. If modules: ['@pinia/nuxt'] you need to configure the autoImports composables:
[  "@pinia/nuxt",  {    autoImports: ["defineStore", "storeToRefs", "acceptHMRUpdate"],  },]
Also you need to check and remove the packages pinia and @pinia/nuxt from your package.json because they will be automatically installed by the module.

Atoms Components