I need to use store in core/config/DefaultLayoutConfig.ts file
I need to set the logo path from the store.
I have tried to import store on core/config/DefaultLayoutConfig.ts this file but it returns the error
"Uncaught ReferenceError: Cannot access '__WEBPACK_DEFAULT_EXPORT__' before initialization"
Please help me with above issue.
Thank you!
Replies (3)
Hi Kishan,
Could you please attach a code that throws an error?
Here is an example of how you can access a Vuex store.
const store = useStore()
const store_value = computed(() => store.state.your_store_variable),Check out Vuex official doc for more info. https://vuex.vuejs.org/
Regards,
Lauris Stepanovs,
Keenthemes Support Team
import LayoutConfigTypes from "@/core/config/LayoutConfigTypes";
import store from "@/store";
console.log(store);
const config: LayoutConfigTypes = {
themeName: "Metronic",
themeVersion: "8.1.1",
demo: "demo1",
main: {
type: "default",
primaryColor: "#009EF7",
logo: {
dark: "/media/logos/ops_logo.png",
light: "/media/logos/ops_logo.png",
},
},
illustrations: {
set: "dozzy-1",
},
loader: {
logo: "/media/logos/ops_logo.png",
display: true,
type: "spinner-message",
},
scrollTop: {
display: true,
},
header: {
display: true,
menuIcon: "font",
width: "fluid",
fixed: {
desktop: true,
tabletAndMobile: true,
},
},
toolbar: {
display: true,
width: "fluid",
fixed: {
desktop: true,
tabletAndMobile: true,
},
},
aside: {
display: true,
theme: "light",
fixed: true,
menuIcon: "font",
minimized: false,
minimize: true,
hoverable: true,
},
content: {
width: "fluid",
},
footer: {
width: "fluid",
},
};
export default config;
-------------------------------------------------------------------------------------------
Here I have added just the 2nd and 3rd lines to get the store object but it returns an error that I sent already.
above code is "/src/core/config/DefaultLayoutConfig.ts" file.
Please understand my issue properly and get back to us as this is very urgent and needs to be fixed ASAP.
Please let me know if you need anything else from me.
Thank you!
Hi,
This approach will not work since code from DefaultLayoutConfig.ts will be executed before the store is created. Instead of getting value directly in DefaultLayoutConfig.ts, you can override them using a mutation. For example, in the config you can set some default logo value, then on the first-page load, you can override this default value with a variable from your store.
To override a logo property you can use the mutation below:
store.commit(Mutations.SET_LAYOUT_CONFIG_PROPERTY, {
property: "config.property.to.override",
value: value_from_your_store,
});Regards,
Lauris Stepanovs,
Keenthemes Support Team
