# node-console

**Repository Path**: yoniro/node-console

## Basic Information

- **Project Name**: node-console
- **Description**: 优化 node 的 console.log 显示
- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2024-06-19
- **Last Updated**: 2026-02-09

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# Node-console

[![Git](https://img.shields.io/badge/Git-Gitee-000?logo=git&logoColor=white)](https://gitee.com/yoniro/node-console)
[![npm version](https://img.shields.io/npm/v/@roniyo/node-console)](https://www.npmjs.com/package/@roniyo/node-console)
[![downloads](https://img.shields.io/npm/dt/@roniyo/node-console)](https://www.npmjs.com/package/@roniyo/node-console)
[![license](https://img.shields.io/badge/license-MIT-green)](LICENSE)
[![last commit](https://img.shields.io/badge/dynamic/json?url=https%3A%2F%2Fgitee.com%2Fapi%2Fv5%2Frepos%2Fyoniro%2Fnode-console%2Fcommits%3Fpage%3D1%26per_page%3D1&query=%24%5B0%5D.commit.committer.date&label=last%20commit&color=blue&style=flat-square)](https://gitee.com/yoniro/node-console)

## 引子

开发nodejs时

你是否为寻找console句柄而不胜其烦,

你是否被[Array] [Object]遮蔽了双眼,

你是否因不能折叠的长内容让你的鼠标滚轮或触控板受尽折磨;

---

来试试node-console，这是一个专为调试node而生的开发工具，让你告别原生console.log的种种烦扰

## 简介

node-console 是一个用于调试 Node.js 的工具：
在浏览器中更清晰地查看 console 输出（支持折叠、类型高亮、堆栈定位）。

## 使用

### 方式一：Git Submodule（子模块）

```shell
git submodule add https://gitee.com/yoniro/node-console.git components/node-console
cd components/node-console/server-src
yarn
```

```
your-project/
├── components/
│   └── node-console/
│       ├── server-src/
│       │   └── src/
│       │       └── index.js
│       └── client-src/   UI 界面
└── your-src/
    └── mian.js
```

### 方式二：NPM 包

```shell
npm install @roniyo/node-console
```

### 引入初始化（两种方式通用）

```javascript
// your-project/your-src/main.js

// Submodule 使用方式：
// const initConsole = require('./components/node-console/server-src/src/index.js');

// NPM 包使用方式：
const initConsole = require('@roniyo/node-console');

const main = ()=>{
    console.log('这是项目的入口函数')
}

initConsole(main, options)

// 使用示例见 node-console/server-src/example.js
```

### 参数

`initConsole(main, options)`

- `main`：你的入口函数
- `options`：配置对象
  - `serverWsPort`：ws 服务端端口，默认 `8888`
  - `clientPort`：客户端端口，默认 `8848`
  - `terminalPrint`：是否在终端打印，默认 `false`
  - `dev`：开发模式（不自动启动 http-server），默认 `false`
    - **一般使用者无需配置**：库默认会自动启动内置 UI 服务，直接可用。
    - **设置为 `true` 的影响**：不会启动 UI 静态服务；如果你没有手动启动 `client-src` 的前端服务，浏览器页面将无法打开/显示为空。

### 启动服务

node-console 依赖中已添加 nodemon

```shell
nodemon your-project/your-src/main.js
```

启动成功后终端输出

```shell
正在开启UI界面,浏览器打开 http://localhost:8848?port=8888 进行调试
websocket服务开启: ws://localhost:8888
```

当调用本函数时，必须要在浏览器打开client界面后, main函数才会执行，否则会一直等待连接阻塞

---

## 更多

项目开发与发布说明请见 **README_DEV.md**。

---

## 版本变更

### 1.0.2

- README 展示优化（徽章、引入方式、参数说明）
- 发布说明补充

### 1.0.1

- 新增懒加载展开机制，优化复杂对象展示并避免递归崩溃
- 支持更多类型与更接近 Chrome 的显示（Map / Set / Promise / Symbol / BigInt 等）
- 增加主题切换与默认配色调整（dark/light）
- 控制台显示优化（字符串折行、颜色、布局）
- `initConsole` 支持参数化配置（serverWsPort / clientPort / terminalPrint），移除 config.json
- README/开发文档整理与发布流程更新

### 1.0.0

- 首次发布上线