{"id":20650,"library":"vconsole-webpack-plugin","title":"vconsole-webpack-plugin","description":"Webpack plugin that automatically injects vConsole (a mobile web debug panel) into webpack bundles. Current stable version is 1.8.0. The plugin wraps vConsole as a webpack plugin to simplify integration during development and ensure removal in production via a simple enable flag. Key differentiator: zero manual script injection, configurable via webpack config, supports entry filtering and conditional enabling based on CLI arguments. Releases are infrequent, last updated in 2019.","status":"maintenance","version":"1.8.0","language":"javascript","source_language":"en","source_url":"https://github.com/diamont1001/vconsole-webpack-plugin","tags":["javascript","webpack","plugin","webpack-plugin","vConsole","vconsole"],"install":[{"cmd":"npm install vconsole-webpack-plugin","lang":"bash","label":"npm"},{"cmd":"yarn add vconsole-webpack-plugin","lang":"bash","label":"yarn"},{"cmd":"pnpm add vconsole-webpack-plugin","lang":"bash","label":"pnpm"}],"dependencies":[{"reason":"vConsole is bundled? No, but the plugin expects vConsole to be available at runtime if not injected as source.","package":"vconsole","optional":true}],"imports":[{"note":"This package does not ship ESM, so using ES import will fail unless transpiled with a bundler or use with Node ESM interop.","wrong":"import vConsolePlugin from 'vconsole-webpack-plugin';","symbol":"default","correct":"const vConsolePlugin = require('vconsole-webpack-plugin');"},{"note":"The export is directly the constructor, not a default property on an object.","wrong":"require('vconsole-webpack-plugin').default;","symbol":"vConsolePlugin","correct":"const vConsolePlugin = require('vconsole-webpack-plugin');"},{"note":"Named import is incorrect; the package exports a single default entity.","wrong":"import { vConsolePlugin } from 'vconsole-webpack-plugin';","symbol":"vConsolePlugin","correct":"import vConsolePlugin from 'vconsole-webpack-plugin';"}],"quickstart":{"code":"// webpack.config.js\nconst vConsolePlugin = require('vconsole-webpack-plugin');\nconst isDebug = process.env.NODE_ENV !== 'production';\n\nmodule.exports = {\n  entry: './src/index.js',\n  output: { filename: 'bundle.js' },\n  plugins: [\n    new vConsolePlugin({\n      enable: isDebug,\n      filter: [] // optional: array of entry file names to exclude\n    })\n  ]\n};","lang":"javascript","description":"Demonstrates how to configure vconsole-webpack-plugin in webpack.config.js, enabling it only in non-production environments with optional entry filtering."},"warnings":[{"fix":"Always explicitly set enable: process.env.NODE_ENV !== 'production' or similar.","message":"enable defaults to true if not set, so vConsole will be injected in production builds if omitted.","severity":"gotcha","affected_versions":"all"},{"fix":"Check vConsole version compatibility; consider using vConsole CDN script directly for newer versions.","message":"This plugin is outdated; vConsole has since moved to v3 with breaking changes, but the plugin may not be compatible.","severity":"gotcha","affected_versions":"current (1.8.0)"},{"fix":"Use with webpack 4 or manually adjust the plugin's integration; for webpack 5 consider alternative solutions.","message":"In webpack 5+ the plugin may not work correctly due to API changes.","severity":"gotcha","affected_versions":">=1.8.0"}],"env_vars":null,"search_vec":"'1.8.0':23 '2019':73 'argument':66 'automat':8 'base':63 'bundl':18 'cli':65 'condit':61 'config':56 'configur':53 'current':19 'debug':14 'develop':36 'differenti':48 'enabl':45,62 'ensur':38 'entri':58 'filter':59 'flag':46 'infrequ':69 'inject':9,52 'integr':34 'javascript':74 'key':47 'last':70 'manual':50 'mobil':12 'panel':15 'plugin':4,6,25,31,76,79 'product':41 'releas':67 'remov':39 'script':51 'simpl':44 'simplifi':33 'stabl':20 'support':57 'updat':71 'vconsol':2,10,27,80,81 'vconsole-webpack-plugin':1 'version':21 'via':42,54 'web':13 'webpack':3,5,17,30,55,75,78 'webpack-plugin':77 'wrap':26 'zero':49","created_at":"2026-04-25T11:24:15.174610+00:00","updated_at":"2026-04-25T11:24:15.174610+00:00","problems":[{"fix":"Ensure the package is listed in devDependencies and run 'npm install' in the correct directory.","cause":"Package not installed or installed as devDependency but required at runtime in a script that doesn't include node_modules.","error":"Error: Cannot find module 'vconsole-webpack-plugin'"},{"fix":"Use 'const vConsolePlugin = require(\"vconsole-webpack-plugin\");'","cause":"Incorrect import: using named import { vConsolePlugin } instead of default import.","error":"TypeError: vConsolePlugin is not a constructor"},{"fix":"If the plugin source is included in the bundle, ensure webpack can transpile ES6 modules, or add node_modules to babel-loader exclusion? Actually, the plugin should work OOTB; this error may happen if the plugin's distributed files are not CommonJS. Reinstall or use a different version.","cause":"The plugin might try to inject ES6 module syntax but webpack is not configured to handle it (e.g., no babel-loader for node_modules).","error":"Module parse failed: Unexpected token (1:0) - You may need an appropriate loader to handle this file type."}],"ecosystem":"npm","meta_description":null,"install_score":null,"quickstart_score":null,"quickstart_tag":null,"pypi_latest":null,"cli_name":"","cli_version":null,"type":"library","homepage":null,"github":"https://github.com/diamont1001/vconsole-webpack-plugin","docs":null,"changelog":null,"pypi":null,"npm":"https://www.npmjs.com/package/vconsole-webpack-plugin","openapi_spec":null,"status_page":null,"smithery":null,"categories":["devops","web-framework"],"base_url":null,"auth_type":null,"provenance":{"verified_status":null,"verified_at":null,"last_verified":"2026-06-17","next_check":"2026-07-24","install_tag":null}}