Enhance the readability of console.log()

by Vue.js Examples

Enhance the readability of console.log()

? Features

  • Support printing the file name, line number and variable name.

  • Support background highlighting of different files. (Currently supporting .js(x), .ts(x), .vue, .svelte, and .astro)

? Install

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

? Usage

vite.config.ts

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

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

Note The code line will only be transformed when there is only one console.log expression. Such as const foo = 'bar';console.log(foo); will be ignored.

❤️ Credits

Inspired by babel-plugin-enhance-log and turbo-console-log

GitHub

View Github