这个 Vite 插件，能让你通过点击控制台中的 console.log 打印信息跳转到编辑器

[lyc575757]

主要功能

1. 根据不同的文件类型高亮输出 console.log 所在的文件名，行数，变量名
2. 通过点击跳转到编辑器对应的 console.log 所在行

效果展示

使用方法

# npm
npm install -D vite-plugin-turbo-console
# yarn
yarn add -D vite-plugin-turbo-console
# pnpm
pnpm i -D vite-plugin-turbo-console

• vite.config.ts

import { defineConfig } from "vite";
import TurboConsole from "vite-plugin-turbo-console";

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [TurboConsole({
    /* options here */
  })],
});

GitHub 仓库

欢迎大家使用并反馈

[LiuJiang]

赞一个，真心不错

[nomagick]

所以还是到处 console.log ，不用调试器是吧。。。

[tanranran]

666

[tianzi123]

@enchilada2020 #19 vscode 自带的配置

[tianzi123]

@caocong #11 我的也是会打开一个新标签页闪一下又关了, 但不会报错

[lyc575757]

@tianzi123 #17 请问只有 catch 中的 console.log 有这个问题吗 还是所有的都有 刚才测试了一下没有复现出来

[tianzi123]

@lyc575757 #26 catch 里面打印 error 的话项目直接白屏,注释掉就没问题就能正常显示了, 另外,其余打印都存在问题,问题为 点击打印的结果按理老说要跳编辑器,但只是会打开一个游览器新标签页 2s 又关了

[lyc575757]

@tianzi123 #27 能去 GitHub 上开个 issus 吗 方便问题追踪

[LOWINC]

@chanChristin https://www.locatorjs.com/

[weijancc]

我试了下是有问题的, 文件路径反斜杠没有转义, 导致报错使页面无法加载
`
console.log("%c🚀 vscodeConfig.js:13 ~ config %c\n%c🔦 Jump to Editor http://localhost:5173/__tc/i.html?f=src\vue\result\util\vscodeConfig.js
`

[chanChristin]

@LOWINC 应该就是这个，确实好用，还不用额外装包

[lyc575757]

@weijancc 嗯 这个问题已经在 0.2.5 版本修复，现在用了 base64 传递文件路径

[chanChristin]

@LOWINC 我们的 react 项目没啥问题，但是 vue3 + vite 项目跳转不过去

[xudashan]

卧槽，老哥牛逼啊，可以使用。

[8tme]

🚌🚌🚌🚌🚌🚌