Getting Started

Unplugin Torbo Console is a universal plugin designed to enhance the Developer Experience for front-end developers when using console. It offers many practical features and flexible options. Thanks to Unplugin, it is compatible with almost all modern front-end frameworks. You can see some of its features in the video below:

Usage

Install

pnpm

pnpm add -D unplugin-turbo-console

yarn

yarn add unplugin-turbo-console -D

npm

npm i unplugin-turbo-console --save-dev

bun

bun add unplugin-turbo-console -d

Integration

Build tools

Vite

// vite.config.ts
import { defineConfig } from 'vite'
import TurboConsole from 'unplugin-turbo-console/vite'

export default defineConfig({
  plugins: [
    TurboConsole({
      /* options here */
    })
  ],
})

webpack

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-turbo-console/webpack').default({ /* options */ }),
  ],
}

Vue CLI

// vue.config.js
const { defineConfig } = require('@vue/cli-service')

module.exports = defineConfig({
  transpileDependencies: true,
  parallel: false, // important!
  configureWebpack: {
    plugins: [
      require('unplugin-turbo-console/webpack').default({
        /* options here */
      })
    ]
  }
})

Rspack

// rspack.config.js
const rspack = require('@rspack/core')
const { VueLoaderPlugin } = require('vue-loader')
/** @type {import('@rspack/cli').Configuration} */

const config = {
  plugins: [
    new VueLoaderPlugin(),
    new rspack.HtmlRspackPlugin({
      template: './index.html'
    }),
    require('unplugin-turbo-console/rspack').default({
        /* options here */
    }),
  ],

}
module.exports = config

Farm

// farm.config.ts
import { defineConfig } from '@farmfe/core'
import vue from '@vitejs/plugin-vue'
import TurboConsole from 'unplugin-turbo-console/farm'

export default defineConfig({
  vitePlugins: [
    vue(),
  ],
  plugins: [
    TurboConsole({
        /* options here */
    })
  ]
})

Meta-Framework

Nuxt

// nuxt.config.ts
export default defineNuxtConfig({
  modules: [
    'unplugin-turbo-console/nuxt'
  ],
  turboConsole: {
    /* options here */
  }
})

SvelteKit

import { sveltekit } from '@sveltejs/kit/vite'
import { defineConfig } from 'vite'
import TurboConsole from 'unplugin-turbo-console/vite'

export default defineConfig({
  plugins: [
    TurboConsole(), // Please add this plugin before sveltekit
    sveltekit()
  ]
})

Astro

// astro.config.mjs
import { defineConfig } from 'astro/config'
import TurboConsole from 'unplugin-turbo-console/astro'

// https://astro.build/config
export default defineConfig({
  integrations: [
    TurboConsole()
  ]
})

Next.js

// next.config.js
/** @type {import('next').NextConfig} */
const nextConfig = {
  webpack(config) {
    config.plugins.push(
      require('unplugin-turbo-console/webpack').default()
    )

    return config
  }
}

module.exports = nextConfig

SolidStart

import { defineConfig } from '@solidjs/start/config'
import TurboConsole from 'unplugin-turbo-console/vite'

export default defineConfig({
  vite: {
    plugins: [
      TurboConsole()
    ]
  },
})