Overview
The Frontend Config
package allow access to store configuration values, such as store name, id and many more.
📘 If you are using Storybook to develop Components and Sections to your store, and you need direct access to your store's configuration values, follow this guide on how to add frontend-config
to your local environment setup.
Import
frontend-config
is already pre-installed on every Shogun Frontend store. To import:
import getConfig from 'frontend-config'
Usage
import React from 'react'
import getConfig from 'frontend-config'
const config = getConfig()
const MyComponent = () => {
console.log(config) // { publicRuntimeConfig: {...}, serverRuntimeConfig: {} }
return (
<p>
Welcome to {config.publicRuntimeConfig.storeName} store!
</p>
)
}
export default MyComponent
Output
name | example value | internal property | description |
| My Store | No | Can be changed from site settings https://frontend.getshogun.com/STORE_ID/settings?tab=general |
| "4bd78b8f6fb62584670d24dcf4b52afc" | No | Shopify only. |
| "shopify" | No | "shopify" | "big_commerce" |
| "new.my-store.com" | No | Shogun Frontend store domain. |
| "my-store.myshopify.com" | No | Usually set on store setup. |
| "my-store.com" | No | Main custom domain on which users are accessing store. |
| "65737a4b-ac95-43d9-91fe-994188b17c9c" | Yes | ⚠️ Internal property that should be only used for debugging. Property name and value might change in the future. |
| "graphql" | Yes | ⚠️ Internal property that should be only used for debugging. Property name and value might change in the future. |
| 23 | Yes | ⚠️ Only available in live/production store and not in Live preview |
|
| Yes | Shopify only. |