{"_path":"/setup","_draft":false,"_partial":false,"_empty":false,"title":"Setup","description":"Learn how to setup atoms locator module in your Nuxt 3 application.","excerpt":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/docs/directory-structure/nuxt.config#buildmodules","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nuxt 3 documentation"}]},{"type":"text","value":" for more information about installing and using modules."}]},{"type":"element","tag":"h2","props":{"id":"installation"},"children":[{"type":"text","value":"Installation"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@atoms-studio/atoms-locator"}]},{"type":"text","value":" dependency to your project:"}]},{"type":"element","tag":"code-group","props":{},"children":[{"type":"element","tag":"code","props":{"code":"yarn add @atoms-studio/atoms-locator\n","filename":"yarn","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"yarn add @atoms-studio/atoms-locator\n"}]}]}]},{"type":"element","tag":"code","props":{"code":"npm install @atoms-studio/atoms-locator\n","filename":"npm","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"npm install @atoms-studio/atoms-locator\n"}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@atoms-studio/atoms-locator"}]},{"type":"text","value":" to the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/modules#the-modules-property","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]}]},{"type":"text","value":" section of your Nuxt configuration:"}]},{"type":"element","tag":"code","props":{"code":"export default {\n  modules: ['@atoms-studio/atoms-locator'],\n  atomsLocator: {\n    // Options\n  }\n}\n","filename":"nuxt.config.js|ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"export default {\n  modules: ['@atoms-studio/atoms-locator'],\n  atomsLocator: {\n    // Options\n  }\n}\n"}]}]}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Defaults:"}]},{"type":"element","tag":"code","props":{"code":"{\n  key: process.env.GOOGLE_API_KEY || 'google_api_key',\n  markerIcon: '',\n  activeMarkerIcon: '',\n  clustererIcon: '',\n  autoImports: false\n}\n","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"{\n  key: process.env.GOOGLE_API_KEY || 'google_api_key',\n  markerIcon: '',\n  activeMarkerIcon: '',\n  clustererIcon: '',\n  autoImports: false\n}\n"}]}]}]},{"type":"element","tag":"h3","props":{"id":"key"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"key"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Google Maps Api key."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Environment variable "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"GOOGLE_API_KEY"}]},{"type":"text","value":" can be used to override "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"key"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"markericon"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"markerIcon"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Provide the path for the Google Marker icon."}]},{"type":"element","tag":"h3","props":{"id":"activemarkericon"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"activeMarkerIcon"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Provide the path for the Google Marker active icon."}]},{"type":"element","tag":"h3","props":{"id":"clusterericon"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"clustererIcon"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Provide the path for the Google Clusterer icon."}]},{"type":"element","tag":"h3","props":{"id":"autoimports"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"autoImports"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Automatic injection of a Pinia store with some utilities and methods for easy implementation of a store locator project."}]},{"type":"element","tag":"alert","props":{"type":"warning"},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you set "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"autoImports: true"}]},{"type":"text","value":" check your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt.config.ts"}]},{"type":"text","value":".\nProbably, Pinia is included in your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]},{"type":"text","value":" array.\nIf "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules: ['@pinia/nuxt']"}]},{"type":"text","value":" you need to configure the autoImports composables:"}]},{"type":"element","tag":"code","props":{"code":"[\n  \"@pinia/nuxt\",\n  {\n    autoImports: [\"defineStore\", \"storeToRefs\", \"acceptHMRUpdate\"],\n  },\n]\n","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"text","value":"[\n  \"@pinia/nuxt\",\n  {\n    autoImports: [\"defineStore\", \"storeToRefs\", \"acceptHMRUpdate\"],\n  },\n]\n"}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also you need to check and remove the packages "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pinia"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@pinia/nuxt"}]},{"type":"text","value":" from your package.json because they will be automatically installed by the module."}]}]}]},"body":{"type":"root","children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Check out the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/docs/directory-structure/nuxt.config#buildmodules","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"text","value":"Nuxt 3 documentation"}]},{"type":"text","value":" for more information about installing and using modules."}]},{"type":"element","tag":"h2","props":{"id":"installation"},"children":[{"type":"text","value":"Installation"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@atoms-studio/atoms-locator"}]},{"type":"text","value":" dependency to your project:"}]},{"type":"element","tag":"code-group","props":{},"children":[{"type":"element","tag":"code","props":{"code":"yarn add @atoms-studio/atoms-locator\n","filename":"yarn","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"yarn add @atoms-studio/atoms-locator"}]}]}]}]}]},{"type":"element","tag":"code","props":{"code":"npm install @atoms-studio/atoms-locator\n","filename":"npm","language":"bash"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"npm install @atoms-studio/atoms-locator"}]}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Then, add "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@atoms-studio/atoms-locator"}]},{"type":"text","value":" to the "},{"type":"element","tag":"a","props":{"href":"https://v3.nuxtjs.org/guide/features/modules#the-modules-property","rel":["nofollow","noopener","noreferrer"],"target":"_blank"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]}]},{"type":"text","value":" section of your Nuxt configuration:"}]},{"type":"element","tag":"code","props":{"code":"export default {\n  modules: ['@atoms-studio/atoms-locator'],\n  atomsLocator: {\n    // Options\n  }\n}\n","filename":"nuxt.config.js|ts","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-738703"},"children":[{"type":"text","value":"export"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-738703"},"children":[{"type":"text","value":"default"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":" {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6cba"},"children":[{"type":"text","value":"modules"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"'@atoms-studio/atoms-locator'"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6cba"},"children":[{"type":"text","value":"atomsLocator"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":": {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-3aae88"},"children":[{"type":"text","value":"// Options"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  }"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h2","props":{"id":"options"},"children":[{"type":"text","value":"Options"}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Defaults:"}]},{"type":"element","tag":"code","props":{"code":"{\n  key: process.env.GOOGLE_API_KEY || 'google_api_key',\n  markerIcon: '',\n  activeMarkerIcon: '',\n  clustererIcon: '',\n  autoImports: false\n}\n","language":"ts"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"{"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  key: "}]},{"type":"element","tag":"span","props":{"class":"ct-08bcd9"},"children":[{"type":"text","value":"process"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-08bcd9"},"children":[{"type":"text","value":"env"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"."}]},{"type":"element","tag":"span","props":{"class":"ct-ce6cba"},"children":[{"type":"text","value":"GOOGLE_API_KEY"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-957c6b"},"children":[{"type":"text","value":"||"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":" "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"'google_api_key'"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  markerIcon: "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  activeMarkerIcon: "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  clustererIcon: "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"''"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  autoImports: "}]},{"type":"element","tag":"span","props":{"class":"ct-160df1"},"children":[{"type":"text","value":"false"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"}"}]}]}]}]}]},{"type":"element","tag":"h3","props":{"id":"key"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"key"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Google Maps Api key."}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Environment variable "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"GOOGLE_API_KEY"}]},{"type":"text","value":" can be used to override "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"key"}]},{"type":"text","value":"."}]},{"type":"element","tag":"h3","props":{"id":"markericon"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"markerIcon"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Provide the path for the Google Marker icon."}]},{"type":"element","tag":"h3","props":{"id":"activemarkericon"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"activeMarkerIcon"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Provide the path for the Google Marker active icon."}]},{"type":"element","tag":"h3","props":{"id":"clusterericon"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"clustererIcon"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Provide the path for the Google Clusterer icon."}]},{"type":"element","tag":"h3","props":{"id":"autoimports"},"children":[{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"autoImports"}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Automatic injection of a Pinia store with some utilities and methods for easy implementation of a store locator project."}]},{"type":"element","tag":"alert","props":{"type":"warning"},"children":[{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"If you set "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"autoImports: true"}]},{"type":"text","value":" check your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"nuxt.config.ts"}]},{"type":"text","value":".\nProbably, Pinia is included in your "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules"}]},{"type":"text","value":" array.\nIf "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"modules: ['@pinia/nuxt']"}]},{"type":"text","value":" you need to configure the autoImports composables:"}]},{"type":"element","tag":"code","props":{"code":"[\n  \"@pinia/nuxt\",\n  {\n    autoImports: [\"defineStore\", \"storeToRefs\", \"acceptHMRUpdate\"],\n  },\n]\n","language":"js"},"children":[{"type":"element","tag":"pre","props":{},"children":[{"type":"element","tag":"code","props":{"__ignoreMap":""},"children":[{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"["}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"\"@pinia/nuxt\""}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":","}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  {"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"    "}]},{"type":"element","tag":"span","props":{"class":"ct-ce6cba"},"children":[{"type":"text","value":"autoImports"}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":": ["}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"\"defineStore\""}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"\"storeToRefs\""}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":", "}]},{"type":"element","tag":"span","props":{"class":"ct-d64f54"},"children":[{"type":"text","value":"\"acceptHMRUpdate\""}]},{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"],"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"  },"}]}]},{"type":"element","tag":"span","props":{"class":"line"},"children":[{"type":"element","tag":"span","props":{"class":"ct-d96051"},"children":[{"type":"text","value":"]"}]}]}]}]}]},{"type":"element","tag":"p","props":{},"children":[{"type":"text","value":"Also you need to check and remove the packages "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"pinia"}]},{"type":"text","value":" and "},{"type":"element","tag":"code-inline","props":{},"children":[{"type":"text","value":"@pinia/nuxt"}]},{"type":"text","value":" from your package.json because they will be automatically installed by the module."}]}]},{"type":"element","tag":"style","children":[{"type":"text","value":".ct-160df1{color:#D19A66}.ct-957c6b{color:#56B6C2}.ct-08bcd9{color:#E5C07B}.ct-3aae88{color:#7F848E}.ct-d64f54{color:#98C379}.ct-ce6cba{color:#E06C75}.ct-738703{color:#C678DD}.ct-d96051{color:#ABB2BF}"}]}],"toc":{"title":"","searchDepth":2,"depth":2,"links":[{"id":"installation","depth":2,"text":"Installation"},{"id":"options","depth":2,"text":"Options","children":[{"id":"key","depth":3,"text":"key"},{"id":"markericon","depth":3,"text":"markerIcon"},{"id":"activemarkericon","depth":3,"text":"activeMarkerIcon"},{"id":"clusterericon","depth":3,"text":"clustererIcon"},{"id":"autoimports","depth":3,"text":"autoImports"}]}]}},"_type":"markdown","_id":"content:2.setup.md","_source":"content","_file":"2.setup.md","_extension":"md"}