Moment For Technology

Vconsole usage configuration

Posted on Aug. 8, 2022, 7:20 p.m. by Michele Bennett
Category: The development tools Tag: The front end

preface

Mobile debugging tool to help developers debug on the mobile terminal

Usage:

The introduction ofWechatfe. Making. IO/vconsole/li...

script src="http://wechatfe.github.io/vconsole/lib/vconsole.min.js? Var vConsole = new vConsole (); v=3.2.0"/script script console.log('Hello world'); /scriptCopy the code

Vconsole webpack - plugin plug-in

Introduction:

Vconsole-webpack-plugin is a Webpack plug-in packaged on the basis of vConsole. You can automatically add vConsole debugging functions through webPack configuration

Installation:

npm install vconsole-webpack-plugin --save-dev

Configuration:

As a debugging module, you need to comment out the code before releasing it. To avoid human error, you are advised to configure it as follows:

Package. json file configuration:

scripts: {
  "dev": "webpack -w --debug",
  "prod": "webpack -p"
}
Copy the code

Webpack. Conf. Js configuration:

Var vConsolePlugin = require('vconsole-webpack-plugin'); Const argv = require('yargs').describe('debug', 'debug environment ') // use 'webpack --debug'.argv; Module.exports = {plugins: [new vConsolePlugin({filter: [], // need to filter the entry file enable:!! Argv. debug // whether to enable}),]}Copy the code

Webpack-dev-server

The usage is the same as above, but don't forget to add --debug when starting the script

// package.json

"scripts": {
  "start:dev": "webpack-dev-server --debug",
}
Copy the code

Window.vconsole = new window.vconsole (); window.vconsole ();

Search
About
mo4tech.com (Moment For Technology) is a global community with thousands techies from across the global hang out!Passionate technologists, be it gadget freaks, tech enthusiasts, coders, technopreneurs, or CIOs, you would find them all here.