1.8.0 • Published 11 months ago
vconsole-webpack-plugin v1.8.0
vconsole-webpack-plugin
webpack plugin for vConsole
帮助开发者在移动端进行调试,本插件是在 vConsole 的基础上封装的 webpack
插件,通过 webpack
配置即可自动添加 vConsole
调试功能,方便实用。
- Release History: History
安装
npm install vconsole-webpack-plugin --save-dev
使用
webpack.conf.js
文件配置里增加以下插件配置即可
// 引入插件
var vConsolePlugin = require('vconsole-webpack-plugin');
module.exports = {
...
plugins: [
new vConsolePlugin({
filter: [], // 需要过滤的入口文件
enable: true // 发布代码前记得改回 false
}),
...
]
...
}
vConsole
作为一个调试模块,注定了需要在发布前把它去掉,为了避免人为操作失误而影响线上功能,这里建议配置如下:
package.json
文件配置:
scripts: {
"dev": "webpack -w --debug",
"prod": "webpack -p"
}
webpack.conf.js
配置:
// 引入插件
var vConsolePlugin = require('vconsole-webpack-plugin');
// 接收运行参数
const argv = require('yargs')
.describe('debug', 'debug 环境') // use 'webpack --debug'
.argv;
module.exports = {
...
plugins: [
new vConsolePlugin({enable: !!argv.debug}),
...
]
...
}
这样,在开发的时候运行 npm run dev
,发布的时候运行 npm run prod
即可。
webpack-dev-server
的配套用法:
用法其实跟上面一样,只是别忘记在启动脚本的时候增加 --debug
即可。如下:
// package.json
"scripts": {
...
"start:dev": "webpack-dev-server --debug",
...
},
例子参考: webpack-demo
直接使用 vconsole
当然,有时候一些页面想临时添加 vconsole
来调试一下,可以直接使用:
<script src="https://unpkg.com/vconsole@latest/dist/vconsole.min.js"></script>
<script>
window.vConsole = new window.VConsole();
</script>
1.8.0
11 months ago
1.7.3
3 years ago
1.7.2
3 years ago
1.7.1
3 years ago
1.7.0
3 years ago
1.6.1
3 years ago
1.6.0
3 years ago
1.5.2
4 years ago
1.5.1
4 years ago
1.5.0
4 years ago
1.4.2
6 years ago
1.4.0
6 years ago
1.3.2
6 years ago
1.3.1
6 years ago
1.3.0
6 years ago
1.2.0
6 years ago
1.1.3
6 years ago
1.1.2
7 years ago
1.1.1
7 years ago
1.1.0
7 years ago
1.0.6
7 years ago
1.0.5
7 years ago
1.0.4
7 years ago
1.0.3
7 years ago
1.0.2
7 years ago
1.0.1
7 years ago
1.0.0
7 years ago