feat: add logger plugin logger config support (#771)

* feat: add logger plugin logger config

* fix: make eslint happy

docs/en/plugins.md

@@ -116,7 +116,8 @@ const logger = createLogger({
     // mutations are logged in the format of `{ type, payload }`
     // we can format it any way we want.
     return mutation.type
-  }
+  },
+  logger: console, // implementation of the `console` API, default `console`
 })
 ```
 

docs/fr/plugins.md

@@ -116,7 +116,8 @@ const logger = createLogger({
     // les mutations sont logguées au format `{ type, payload }`
     // nous pouvons les formater comme nous le souhaitons.
     return mutation.type
-  }
+  },
+  logger: console, // implementation of the `console` API, default `console`
 })
 ```
 

docs/zh-cn/plugins.md

@@ -116,7 +116,8 @@ const logger = createLogger({
     // mutation 按照 { type, payload } 格式记录
     // 我们可以按任意方式格式化
     return mutation.type
-  }
+  },
+  logger: console, // 自定义 console 实现，默认为 `console`
 })
 ```
 

src/plugins/logger.js

@@ -6,13 +6,14 @@ export default function createLogger ({
   collapsed = true,
   filter = (mutation, stateBefore, stateAfter) => true,
   transformer = state => state,
-  mutationTransformer = mut => mut
+  mutationTransformer = mut => mut,
+  logger = console
 } = {}) {
   return store => {
     let prevState = deepCopy(store.state)
 
     store.subscribe((mutation, state) => {
-      if (typeof console === 'undefined') {
+      if (typeof logger === 'undefined') {
         return
       }
       const nextState = deepCopy(state)
@@ -23,24 +24,24 @@ export default function createLogger ({
         const formattedMutation = mutationTransformer(mutation)
         const message = `mutation ${mutation.type}${formattedTime}`
         const startMessage = collapsed
-          ? console.groupCollapsed
-          : console.group
+          ? logger.groupCollapsed
+          : logger.group
 
         // render
         try {
-          startMessage.call(console, message)
+          startMessage.call(logger, message)
         } catch (e) {
           console.log(message)
         }
 
-        console.log('%c prev state', 'color: #9E9E9E; font-weight: bold', transformer(prevState))
-        console.log('%c mutation', 'color: #03A9F4; font-weight: bold', formattedMutation)
-        console.log('%c next state', 'color: #4CAF50; font-weight: bold', transformer(nextState))
+        logger.log('%c prev state', 'color: #9E9E9E; font-weight: bold', transformer(prevState))
+        logger.log('%c mutation', 'color: #03A9F4; font-weight: bold', formattedMutation)
+        logger.log('%c next state', 'color: #4CAF50; font-weight: bold', transformer(nextState))
 
         try {
-          console.groupEnd()
+          logger.groupEnd()
         } catch (e) {
-          console.log('—— log end ——')
+          logger.log('—— log end ——')
         }
       }