1.0.8 • Published 4 years ago
pagelog-webpack-plugin v1.0.8
pagelog-webpack-plugin
介绍
- 该插件用于在webpack开发环境下预先启动json解析页面http代理服务和数据传输服务。只为pagelog插件提供数据打印服务。
- pagelog插件将可JSON序列化数据打印到指定JSON解析页面,方便阅览、代码收缩、下载、复制、修改等功能集成。
- 主要用于打印api接口返回的超大数据集合,用于便捷分析、识别和提取。
- 支持打印数据类型 object(非function), array, string, number, boolean,不支持打印函数类、dom类、window等实例对象。
- 如果pagelog-webpack-plugin插件服务没有启动,数据将默认使用console.log打印到控制台。在生产环境下插件使用console.log打印。
软件架构
- 配和 pagelog 使用。
插件安装
- npm install pagelog --save
- npm install pagelog-webpack-plugin --save-dev
API
wsPort: string || number
socket服务端口号, default: 11996
htmlPort: string || number
html打印服务端口号, default: 51996
forceRun: boolean
true: 开启后重新编译后强制重启服务。default: false
使用说明
1、webpack插件配置,只需在development环境下启动插件。
- 用于先启动json解析页面http代理服务和数据传输服务。
- PageLog页面服务默认访问地址:http://localhost:7374
- 后台socket数据互动服务默认占用端口号:8081
webpack.config.js
const PageLogWebpackPlugin = require('pagelog-webpack-plugin');
module.exports = { plugins: new PageLogWebpackPlugin() }
* 2、简单使用:在项目入口引入pagelog
> src/index.js
```javascript
// 简单引入
import 'pagelog';
// 简单引入--直接使用
let info = new String() || new Array() || new Boolean() || new Object() || new Number();// 支持数据类型 object(非function), array, string, number, boolean
console.plog(info);
- 3、可配置使用: 在项目入口引入pagelog
src/index.js
// 可配置引入
import pagelog from 'pagelog';
// 选择性使用
let info = new String() || new Array() || new Boolean() || new Object() || new Number();// 支持数据类型 object(非function), array, string, number, boolean
pagelog.log(info);
- 4、在typescript项目中的d.ts声明
types/global.d.ts
// 声明 plog方法类 declare interface Console { plog: any,
} // 如果使用可配置模式,需要添加如下声明 declare module 'pagelog';
后期补充 @types/pagelog 插件自动声明类型。