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 ——')
  }
  }