diff --git a/package-lock.json b/package-lock.json
index eecec00fa..a7bd6d351 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -27,6 +27,7 @@
         "mitt": "^2.1.0",
         "register-service-worker": "^1.7.1",
         "vue": "^3.2.26",
+        "vue-logger-plugin": "^2.2.3",
         "vue-router": "^4.0.12",
         "vuex": "^4.0.1",
         "vuex-persistedstate": "^4.0.0-beta.3"
@@ -16384,6 +16385,11 @@
         "node": ">=8"
       }
     },
+    "node_modules/vue-logger-plugin": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/vue-logger-plugin/-/vue-logger-plugin-2.2.3.tgz",
+      "integrity": "sha512-PGGwFarWpReyJc8XONuNBb86mpfLqYO6+MWjkFnCDWcagjM2BLY7rskLTgn3eT3skq0qu+2K2roiIAgiXJDXSQ=="
+    },
     "node_modules/vue-router": {
       "version": "4.2.5",
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-4.2.5.tgz",
diff --git a/package.json b/package.json
index db6f95d76..b1be7a2f8 100644
--- a/package.json
+++ b/package.json
@@ -30,6 +30,7 @@
     "mitt": "^2.1.0",
     "register-service-worker": "^1.7.1",
     "vue": "^3.2.26",
+    "vue-logger-plugin": "^2.2.3",
     "vue-router": "^4.0.12",
     "vuex": "^4.0.1",
     "vuex-persistedstate": "^4.0.0-beta.3"
diff --git a/src/App.vue b/src/App.vue
index 82a3580cc..fbd764067 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -13,6 +13,7 @@ import { mapGetters, useStore } from 'vuex';
 import { initialise, resetConfig } from '@/adapter'
 import { useRouter } from 'vue-router';
 import { translate, useProductIdentificationStore } from "@hotwax/dxp-components";
+import logger from '@/logger'
 
 export default defineComponent({
   name: 'App',
@@ -95,7 +96,7 @@ export default defineComponent({
     if(this.userToken) {
       // Get product identification from api using dxp-component
       await useProductIdentificationStore().getIdentificationPref(this.currentEComStore?.productStoreId)
-        .catch((error) => console.error(error));
+        .catch((error) => logger.error(error));
     }
   },
   unmounted() {
diff --git a/src/components/EditPickerModal.vue b/src/components/EditPickerModal.vue
index 2fae065f8..19d05b90f 100644
--- a/src/components/EditPickerModal.vue
+++ b/src/components/EditPickerModal.vue
@@ -67,6 +67,7 @@ import { hasError } from '@/adapter'
 import { translate } from '@hotwax/dxp-components'
 import { UtilService } from "@/services/UtilService";
 import { PicklistService } from "@/services/PicklistService";
+import logger from "@/logger";
 
 export default defineComponent({
   name: "EditPickersModal",
@@ -151,7 +152,7 @@ export default defineComponent({
           throw resp.data
         }
       } catch (err) {
-        console.error('Failed to fetch the pickers information or there are no pickers available', err)
+        logger.error('Failed to fetch the pickers information or there are no pickers available', err)
       }
     },
     async confirmSave() {
@@ -191,7 +192,7 @@ export default defineComponent({
         }
       } catch (err) {
         showToast(translate('Something went wrong, could not edit picker.'))
-        console.error('Something went wrong, could not edit picker')
+        logger.error('Something went wrong, could not edit picker')
       }
     },
     closeModal() {
diff --git a/src/components/Image.vue b/src/components/Image.vue
index 936939ea9..ca8ff499b 100644
--- a/src/components/Image.vue
+++ b/src/components/Image.vue
@@ -4,6 +4,7 @@
 
 <script lang="ts">
 import { defineComponent } from "vue";
+import logger from "@/logger";
 
 export default defineComponent({
   name: "Image",
@@ -51,7 +52,7 @@ export default defineComponent({
           this.checkIfImageExists(this.src).then(() => {
             this.imageUrl = this.src;
           }).catch(() => {
-            console.error("Image doesn't exist");
+            logger.error("Image doesn't exist");
           })
         } else {
           // Image is from resource server, hence append to base resource url, check for existence and assign
@@ -59,7 +60,7 @@ export default defineComponent({
           this.checkIfImageExists(imageUrl).then(() => {
             this.imageUrl = imageUrl;
           }).catch(() => {
-            console.error("Image doesn't exist");
+            logger.error("Image doesn't exist");
           })
         }
       }
diff --git a/src/components/NotificationPreferenceModal.vue b/src/components/NotificationPreferenceModal.vue
index a9b9183d0..38d6307e6 100644
--- a/src/components/NotificationPreferenceModal.vue
+++ b/src/components/NotificationPreferenceModal.vue
@@ -54,6 +54,7 @@ import { showToast } from "@/utils";
 import emitter from "@/event-bus"
 import { generateTopicName } from "@/utils/firebase";
 import { subscribeTopic, unsubscribeTopic } from '@/adapter'
+import logger from "@/logger";
 
 export default defineComponent({
   name: "NotificationPreferenceModal",
@@ -134,7 +135,7 @@ export default defineComponent({
       try {
         await this.handleTopicSubscription()
       } catch (error) {
-        console.error(error)
+        logger.error(error)
       } finally {
         emitter.emit("dismissLoader")
       }
diff --git a/src/logger/index.ts b/src/logger/index.ts
new file mode 100644
index 000000000..8fc4cd4ea
--- /dev/null
+++ b/src/logger/index.ts
@@ -0,0 +1,71 @@
+import { createLogger, StringifyObjectsHook } from 'vue-logger-plugin'
+
+// TODO Implement logic to send logs to server
+// https://github.com/dev-tavern/vue-logger-plugin#sample-custom-hook---leveraging-axios-to-send-logs-to-server
+
+// https://github.com/dev-tavern/vue-logger-plugin#levels
+// Log levels (one of: debug, info, warn, error, log)
+// log <-- error <-- warn <-- info <-- debug
+// (from left to right: least inclusive to most inclusive)
+// const level = (process.env.VUE_APP_DEFAULT_LOG_LEVEL ? process.env.VUE_APP_DEFAULT_LOG_LEVEL : "error") as any;
+
+// Using StringifyObjectsHook as the objects are references and values may change during the code execution
+// https://github.com/dev-tavern/vue-logger-plugin#built-in-hooks
+// StringifyObjectsHook Applies JSON.stringify on all objects provided as arguments to a logging method.
+// StringifyAndParseObjectsHook Applies JSON.stringify and JSON.parse on all objects provided as arguments to a logging method.
+
+// enabled vs consoleEnabled
+// Setting enabled to false will disable all logger functionality (console output + hook invocations).
+// Setting consoleEnabled to false will disable just the console output but will still invoke the hooks.
+
+const logger = createLogger({
+  enabled: true,
+  beforeHooks: [ StringifyObjectsHook ]
+});
+
+function getStack(error: any) {
+  // Handling incompatibilities
+  // Non-standard: This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. 
+  // There may also be large incompatibilities between implementations and the behavior may change in the future.
+  // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error/stack
+  try {
+    return error.stack;
+  } catch (err) {
+    logger.warn("Error stack is not supported");
+  }
+  return error;
+}
+
+export default {
+  install(app: any, options: any) {
+
+    // We could pass error: any, instance: any, info: any
+    // TODO Use other variables to extract more information about the error
+    app.config.errorHandler = (error: any) => {
+      // TODO Improve code to add more information related to code failed
+      logger.error("Global handler:" + getStack(error));
+    }
+    const level = options.level ? options.level : "error"
+
+    logger.apply({
+      level
+    })
+
+    logger.install(app);
+  },
+  debug(...args: any): void {
+    logger.debug(...args)
+  },
+  info(...args: any): void {
+    logger.info(...args)
+  },
+  warn(...args: any): void {
+    logger.warn(...args)
+  },
+  error(...args: any): void {
+    logger.error(...args)
+  },
+  log(...args: any): void {
+    logger.log(...args)
+  }
+}
diff --git a/src/main.ts b/src/main.ts
index 64e8560cc..841f47afa 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -37,11 +37,15 @@ import localeMessages from './locales';
 import { login, logout, loader } from '@/utils/user';
 import { addNotification, storeClientRegistrationToken } from '@/utils/firebase';
 import { getConfig, getProductIdentificationPref, initialise, setProductIdentificationPref, setUserLocale } from '@/adapter';
+import logger from './logger';
 
 const app = createApp(App)
   .use(IonicVue, {
     mode: 'md'
   })
+  .use(logger, {
+    level: process.env.VUE_APP_DEFAULT_LOG_LEVEL
+  })
   .use(router)
   .use(store)
   .use(permissionPlugin, {
diff --git a/src/services/OrderService.ts b/src/services/OrderService.ts
index c170069c9..f85a5821a 100644
--- a/src/services/OrderService.ts
+++ b/src/services/OrderService.ts
@@ -3,6 +3,7 @@ import emitter from '@/event-bus';
 import { translate } from '@hotwax/dxp-components';
 import store from '@/store';
 import { formatPhoneNumber, showToast } from '@/utils';
+import logger from '@/logger';
 
 const getOpenOrders = async (payload: any): Promise <any> => {
   return api({
@@ -86,7 +87,7 @@ const rejectItem = async (payload: any): Promise<any> => {
       showToast(translate('Something went wrong'));
     }
   } catch (error) {
-    console.error(error);
+    logger.error(error);
   }
   emitter.emit("dismissLoader");
   return resp;
@@ -207,7 +208,7 @@ const printShippingLabelAndPackingSlip = async (shipmentIds: Array<string>): Pro
 
   } catch (err) {
     showToast(translate('Failed to print shipping label and packing slip'))
-    console.error("Failed to load shipping label and packing slip", err)
+    logger.error("Failed to load shipping label and packing slip", err)
   }
 }
 
@@ -253,7 +254,7 @@ const getShippingPhoneNumber = async (orderId: string): Promise<any> => {
       throw resp.data
     }
   } catch (err) {
-    console.error('Failed to fetch customer phone number', err)
+    logger.error('Failed to fetch customer phone number', err)
   }
   return phoneNumber
 }
diff --git a/src/store/modules/order/actions.ts b/src/store/modules/order/actions.ts
index f1868270c..242ccb8f1 100644
--- a/src/store/modules/order/actions.ts
+++ b/src/store/modules/order/actions.ts
@@ -9,6 +9,7 @@ import { translate } from "@hotwax/dxp-components";
 import emitter from '@/event-bus'
 import store from "@/store";
 import { prepareOrderQuery } from "@/utils/solrHelper";
+import logger from "@/logger";
 
 const actions: ActionTree<OrderState , RootState> ={
   async getOpenOrders({ commit, state }, payload) {
@@ -90,7 +91,7 @@ const actions: ActionTree<OrderState , RootState> ={
       }
       emitter.emit("dismissLoader");
     } catch(err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     }
 
@@ -199,7 +200,7 @@ const actions: ActionTree<OrderState , RootState> ={
         throw resp.data;
       }
     } catch (err) {
-      console.error(err)
+      logger.error(err)
     }
 
     await dispatch('updateCurrent', { order: currentOrder })
@@ -287,7 +288,7 @@ const actions: ActionTree<OrderState , RootState> ={
       }
       emitter.emit("dismissLoader");
     } catch(err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     }
 
@@ -356,7 +357,7 @@ const actions: ActionTree<OrderState , RootState> ={
       }
       emitter.emit("dismissLoader");
     } catch(err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     }
 
@@ -400,7 +401,7 @@ const actions: ActionTree<OrderState , RootState> ={
       }
       emitter.emit("dismissLoader")
     } catch(err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     }
 
@@ -501,7 +502,7 @@ const actions: ActionTree<OrderState , RootState> ={
       }
       emitter.emit("dismissLoader")
     } catch(err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     }
 
@@ -627,7 +628,7 @@ const actions: ActionTree<OrderState , RootState> ={
         showToast(translate("Orders Not Found"))
       }
     } catch (err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     } finally {
       emitter.emit("dismissLoader")
@@ -712,7 +713,7 @@ const actions: ActionTree<OrderState , RootState> ={
         showToast(translate("Orders Not Found"))
       }
     } catch (err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     } finally {
       emitter.emit("dismissLoader")
@@ -799,7 +800,7 @@ const actions: ActionTree<OrderState , RootState> ={
         showToast(translate("Orders Not Found"))
       }
     } catch(err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate("Something went wrong"))
     } finally {
       emitter.emit("dismissLoader")
@@ -837,7 +838,7 @@ const actions: ActionTree<OrderState , RootState> ={
         throw resp.data
       }
     } catch (err) {
-      console.error('Failed to fetch order item rejection history', err)
+      logger.error('Failed to fetch order item rejection history', err)
     }
 
     commit(types.ORDER_ITEM_REJECTION_HISTORY_UPDATED, rejectionHistory)
@@ -893,7 +894,7 @@ const actions: ActionTree<OrderState , RootState> ={
         throw resp.data
       }
     } catch (err) {
-      console.error("Error in fetching payment detail.", err);
+      logger.error("Error in fetching payment detail.", err);
     }
   },
 
@@ -907,7 +908,7 @@ const actions: ActionTree<OrderState , RootState> ={
         contactNumber
       }
     } catch (err) {
-      console.error("Error in fetching customer phone number for current order", err);
+      logger.error("Error in fetching customer phone number for current order", err);
     }
     commit(types.ORDER_CURRENT_UPDATED, { order });
   },
diff --git a/src/store/modules/product/actions.ts b/src/store/modules/product/actions.ts
index ec402af71..9704cc13e 100644
--- a/src/store/modules/product/actions.ts
+++ b/src/store/modules/product/actions.ts
@@ -7,6 +7,7 @@ import { showToast } from '@/utils'
 import { hasError } from '@/adapter'
 import { translate } from '@hotwax/dxp-components'
 import emitter from '@/event-bus'
+import logger from "@/logger";
 
 
 const actions: ActionTree<ProductState, RootState> = {
@@ -37,7 +38,7 @@ const actions: ActionTree<ProductState, RootState> = {
       // Handled empty response in case of failed query
       if (resp.data) commit(types.PRODUCT_ADD_TO_CACHED_MULTIPLE, { products });
     } else {
-      console.error('Something went wrong')
+      logger.error('Something went wrong')
     }
     // TODO Handle specific error
     return resp;
@@ -69,7 +70,7 @@ const actions: ActionTree<ProductState, RootState> = {
         showToast(translate("Products not found"));
       }
     } catch(error){
-      console.error(error)
+      logger.error(error)
       commit(types.PRODUCT_LIST_UPDATED, { products: [], total: 0, queryString: '' })
       showToast(translate("Something went wrong"));
     }
@@ -118,7 +119,7 @@ const actions: ActionTree<ProductState, RootState> = {
         showToast(translate("Product not found"));
       }
     } catch(error){
-      console.error(error)
+      logger.error(error)
       showToast(translate("Something went wrong"));
     }
     emitter.emit("dismissLoader");
diff --git a/src/store/modules/stock/actions.ts b/src/store/modules/stock/actions.ts
index dbeafee7a..b8d36d70d 100644
--- a/src/store/modules/stock/actions.ts
+++ b/src/store/modules/stock/actions.ts
@@ -6,6 +6,7 @@ import * as types from './mutation-types'
 import { hasError } from '@/adapter'
 import { showToast } from '@/utils'
 import { translate } from "@hotwax/dxp-components";
+import logger from '@/logger'
 
 const actions: ActionTree<StockState, RootState> = {
   async fetchStock({ commit }, { productId }) {
@@ -22,7 +23,7 @@ const actions: ActionTree<StockState, RootState> = {
         throw resp.data;
       }
     } catch (err) {
-      console.error(err)
+      logger.error(err)
       showToast(translate('No data available!'))
     }
   }
diff --git a/src/store/modules/user/actions.ts b/src/store/modules/user/actions.ts
index 785121d24..6d3cec946 100644
--- a/src/store/modules/user/actions.ts
+++ b/src/store/modules/user/actions.ts
@@ -28,6 +28,7 @@ import {
 import { translate, useAuthStore, useProductIdentificationStore, useUserStore } from '@hotwax/dxp-components'
 import { generateDeviceId, generateTopicName } from '@/utils/firebase'
 import emitter from '@/event-bus'
+import logger from '@/logger';
 
 const actions: ActionTree<UserState, RootState> = {
 
@@ -61,7 +62,7 @@ const actions: ActionTree<UserState, RootState> = {
         if (hasPermission) {
           const permissionError = 'You do not have permission to access the app.';
           showToast(translate(permissionError));
-          console.error("error", permissionError);
+          logger.error("error", permissionError);
           return Promise.reject(new Error(permissionError));
         }
       }
@@ -111,7 +112,7 @@ const actions: ActionTree<UserState, RootState> = {
       // If any of the API call in try block has status code other than 2xx it will be handled in common catch block.
       // TODO Check if handling of specific status codes is required.
       showToast(translate('Something went wrong while login. Please contact administrator'));
-      console.error("error", err);
+      logger.error("error", err);
       return Promise.reject(new Error(err))
     }
   },
@@ -137,7 +138,7 @@ const actions: ActionTree<UserState, RootState> = {
         // Added logic to remove the `//` from the resp as in case of get request we are having the extra characters and in case of post we are having 403
         resp = JSON.parse(resp.startsWith('//') ? resp.replace('//', '') : resp)
       } catch(err) {
-        console.error('Error parsing data', err)
+        logger.error('Error parsing data', err)
       }
 
       if(resp?.logoutAuthType == 'SAML2SSO') {
@@ -229,10 +230,10 @@ const actions: ActionTree<UserState, RootState> = {
       if (resp.status === 200 && !hasError(resp) && resp.data?.docs) {
         config = resp.data?.docs[0];
       } else {
-        console.error('Failed to fetch partial order rejection configuration');
+        logger.error('Failed to fetch partial order rejection configuration');
       }
     } catch (err) {
-      console.error(err);
+      logger.error(err);
     } 
     commit(types.USER_PARTIAL_ORDER_REJECTION_CONFIG_UPDATED, config);   
   },
@@ -275,7 +276,7 @@ const actions: ActionTree<UserState, RootState> = {
       }
     } catch(err) {
       showToast(translate('Failed to update configuration'))
-      console.error(err)
+      logger.error(err)
     }
 
     // Fetch the updated configuration
@@ -310,7 +311,7 @@ const actions: ActionTree<UserState, RootState> = {
       resp = await getNotificationUserPrefTypeIds(process.env.VUE_APP_NOTIF_APP_ID)
       userPrefIds = resp.docs.map((userPref: any) => userPref.userPrefTypeId)
     } catch (error) {
-      console.error(error)
+      logger.error(error)
     } finally {
       // checking enumerationResp as we want to show disbaled prefs if only getNotificationEnumIds returns
       // data and getNotificationUserPrefTypeIds fails or returns empty response (all disbaled)
@@ -332,7 +333,7 @@ const actions: ActionTree<UserState, RootState> = {
     try {
       await storeClientRegistrationToken(registrationToken, firebaseDeviceId, process.env.VUE_APP_NOTIF_APP_ID)
     } catch (error) {
-      console.error(error)
+      logger.error(error)
     }
   },
 
diff --git a/src/store/modules/util/actions.ts b/src/store/modules/util/actions.ts
index 9b8c08d71..5e6203cd0 100644
--- a/src/store/modules/util/actions.ts
+++ b/src/store/modules/util/actions.ts
@@ -4,6 +4,7 @@ import UtilState from './UtilState'
 import * as types from './mutation-types'
 import { UtilService } from '@/services/UtilService'
 import { hasError } from '@/adapter'
+import logger from '@/logger'
 
 const actions: ActionTree<UtilState, RootState> = {
   async fetchRejectReasons({ commit }) {
@@ -28,7 +29,7 @@ const actions: ActionTree<UtilState, RootState> = {
         throw resp.data
       }
     } catch (err) {
-      console.error('Failed to fetch reject reasons', err)
+      logger.error('Failed to fetch reject reasons', err)
     }
 
     commit(types.UTIL_REJECT_REASONS_UPDATED, rejectReasons)
@@ -74,7 +75,7 @@ const actions: ActionTree<UtilState, RootState> = {
         throw resp.data
       }
     } catch(err) {
-      console.error('Error fetching payment method description', err)
+      logger.error('Error fetching payment method description', err)
     }
 
     return paymentMethodTypeDesc;
@@ -116,7 +117,7 @@ const actions: ActionTree<UtilState, RootState> = {
         throw resp.data
       }
     } catch(err) {
-      console.error('Error fetching status description', err)
+      logger.error('Error fetching status description', err)
     }
 
     return statusDesc;
diff --git a/src/views/AssignPickerModal.vue b/src/views/AssignPickerModal.vue
index 02f3213d1..5c7856f4b 100644
--- a/src/views/AssignPickerModal.vue
+++ b/src/views/AssignPickerModal.vue
@@ -73,6 +73,7 @@ import { showToast } from "@/utils";
 import { hasError } from '@/adapter'
 import { translate } from "@hotwax/dxp-components";
 import { PicklistService } from '@/services/PicklistService'
+import logger from '@/logger'
 
 export default defineComponent({
   name: "AssignPickerModal",
@@ -183,10 +184,10 @@ export default defineComponent({
           this.availablePickers = this.availablePickers.concat(pickers);
           total = resp.data.count;
         } else {
-          console.error(translate('Something went wrong'))
+          logger.error(translate('Something went wrong'))
         }
       } catch (err) {
-        console.error(translate('Something went wrong'))
+        logger.error(translate('Something went wrong'))
       }
       this.isScrollable = this.availablePickers.length < total;
     }
diff --git a/src/views/OrderDetail.vue b/src/views/OrderDetail.vue
index 3b2f6a39d..eca58b0dc 100644
--- a/src/views/OrderDetail.vue
+++ b/src/views/OrderDetail.vue
@@ -193,6 +193,7 @@ import RejectOrderModal from "@/components/RejectOrderModal.vue";
 import { translate } from "@hotwax/dxp-components";
 import EditPickerModal from "@/components/EditPickerModal.vue";
 import emitter from '@/event-bus'
+import logger from "@/logger";
 
 export default defineComponent({
   name: "OrderDetail",
@@ -359,7 +360,7 @@ export default defineComponent({
 
       } catch(err) {
         showToast(translate("Failed to load packing slip"))
-        console.error(err)
+        logger.error(err)
       }
     },
     async shipToCustomer() {
@@ -375,7 +376,7 @@ export default defineComponent({
           this.customerEmail = resp.data.orderContacts.email.email
         }
       } catch (error) {
-        console.error(error)
+        logger.error(error)
       }
     },
     async sendReadyForPickupEmail(order: any) {
@@ -401,7 +402,7 @@ export default defineComponent({
                 }
               } catch (error) {
                 showToast(translate("Something went wrong while sending the email."))
-                console.error(error)
+                logger.error(error)
               }
             }
           }]
diff --git a/src/views/Orders.vue b/src/views/Orders.vue
index a9c0104da..375b341f0 100644
--- a/src/views/Orders.vue
+++ b/src/views/Orders.vue
@@ -208,6 +208,7 @@ import { translate } from "@hotwax/dxp-components";
 import AssignPickerModal from "./AssignPickerModal.vue";
 import { OrderService } from "@/services/OrderService";
 import { Actions, hasPermission } from '@/authorization'
+import logger from "@/logger";
 
 export default defineComponent({
   name: 'Orders',
@@ -296,7 +297,7 @@ export default defineComponent({
 
       } catch(err) {
         showToast(translate("Failed to load packing slip"))
-        console.error(err)
+        logger.error(err)
       }
 
 
@@ -439,7 +440,7 @@ export default defineComponent({
                 }
               } catch (error) {
                 showToast(translate("Something went wrong while sending the email."))
-                console.error(error)
+                logger.error(error)
               }
             }
           }]
diff --git a/src/views/ProductDetail.vue b/src/views/ProductDetail.vue
index 4ca55f6e3..1ab4c0f82 100644
--- a/src/views/ProductDetail.vue
+++ b/src/views/ProductDetail.vue
@@ -93,6 +93,7 @@ import { hasError } from '@/adapter'
 import { sortSizes } from '@/apparel-sorter';
 import OtherStoresInventoryModal from "./OtherStoresInventoryModal.vue";
 import { ShopifyImg, getProductIdentificationValue, translate, useProductIdentificationStore } from "@hotwax/dxp-components";
+import logger from "@/logger";
 
 export default defineComponent({
   name: "ProductDetail",
@@ -214,7 +215,7 @@ export default defineComponent({
           })
         }
       } catch (error) {
-        console.error(error)
+        logger.error(error)
         showToast(translate("Something went wrong"));
       }
     },
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 83e8b0a0b..3a9a68639 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -247,6 +247,7 @@ import { translate } from "@hotwax/dxp-components";
 import { Actions, hasPermission } from '@/authorization'
 import { generateTopicName } from "@/utils/firebase";
 import emitter from "@/event-bus"
+import logger from '@/logger';
 
 export default defineComponent({
   name: 'Settings',
@@ -343,7 +344,7 @@ export default defineComponent({
       try {
         await removeClientRegistrationToken(this.firebaseDeviceId, process.env.VUE_APP_NOTIF_APP_ID)
       } catch (error) {
-        console.error(error)
+        logger.error(error)
       }
 
       this.store.dispatch('user/logout', { isUserUnauthorised: false }).then((redirectionUrl) => {
@@ -387,7 +388,7 @@ export default defineComponent({
           this.availableShipmentMethods = resp.data.docs;
         }
       } catch(err) {
-        console.error(err)
+        logger.error(err)
       }
     },
     async getRerouteFulfillmentConfiguration(settingTypeEnumId?: any) {
@@ -418,7 +419,7 @@ export default defineComponent({
           })
         }
       } catch(err) {
-        console.error(err)
+        logger.error(err)
       }
     },
     async updateRerouteFulfillmentConfiguration(config: any, value: any) {
@@ -444,7 +445,7 @@ export default defineComponent({
         }
       } catch(err) {
         showToast(translate('Failed to update configuration'))
-        console.error(err)
+        logger.error(err)
       }
       // Fetch the updated configuration
       await this.getRerouteFulfillmentConfiguration(config.settingTypeEnumId);
diff --git a/src/views/ShipToStoreOrders.vue b/src/views/ShipToStoreOrders.vue
index 895069aa4..21d9229ff 100644
--- a/src/views/ShipToStoreOrders.vue
+++ b/src/views/ShipToStoreOrders.vue
@@ -132,6 +132,7 @@ import emitter from "@/event-bus"
 import { Actions, hasPermission } from '@/authorization'
 import { OrderService } from "@/services/OrderService";
 import { translate } from "@hotwax/dxp-components";
+import logger from "@/logger";
 
 export default defineComponent({
   name: 'ShipToStoreOrders',
@@ -302,7 +303,7 @@ export default defineComponent({
         }
         emitter.emit("dismissLoader")
       } catch (err) {
-        console.error(err)
+        logger.error(err)
         showToast(translate("Something went wrong"))
       }
 
@@ -348,7 +349,7 @@ export default defineComponent({
         }
         emitter.emit("dismissLoader")
       } catch (err) {
-        console.error(err)
+        logger.error(err)
         showToast(translate("Something went wrong"))
       }
 
@@ -379,7 +380,7 @@ export default defineComponent({
                 }
               } catch (error) {
                 showToast(translate("Something went wrong while sending the email."))
-                console.error(error)
+                logger.error(error)
               }
             }
           }]