eruda调试器使用

1.写一个uitls.js文件，在main.js中引入

export const isDebug = /status=1/.test(window.location.href);
let hasDebug = false
const userToken = 'xxxx'
if (isDebug) {
  if (userToken && !hasDebug) {
    hasDebug = true
    const script = document.createElement('script');
    script.onload = () => {
      /* eslint-disable */
      eruda.init();
      isDebug && logEnv();
    };
    script.src = 'http://eruda.liriliri.io/eruda.min.js';
    document.getElementsByTagName('head')[0].appendChild(script);
  }
}
function logEnv () {
  console.log('输出相关的东西')
  console.log('访问地址:', location.href);
  console.log('请求地址:', );
  console.log('运行环境:', -----);
};

status=1为自定义地址栏输入的标志

2参数输出

当请求接口,需要打印参数,接口,以及返回值,可以在request里面引入这个文件

 import { isDebug } from '../../utils.js'

 isDebug && Console.log(`${config.funcName} params: `, config.data || {})
 isDebug && Console.log(`${config.funcName} option: `, newConfig)

还有其他的方法实现

比如用vconsole包实现调试,判断isDebug的状态，直接写入到环境配置当中:VUE_APP_REQ_DEBUG = 2 然后用const isDebug = process.env.VUE_APP_REQ_DEBUG === '2' 判断需不需要debug

可参考另一篇文章: 如何在移动端项目里面使用console

3.效果