字节笔记本

2026年2月23日

cnchar - 功能全面的汉字工具库

本文介绍 cnchar,一个功能全面的汉字工具库,支持拼音转换、笔画计算、偏旁部首查询、成语歇后语、语音合成、汉字可视化绘制等功能。该库采用插件化架构,可根据需求灵活选择功能模块,适用于浏览器、Node.js 和微信小程序等多种环境。

项目简介

cnchar 是一个开源的 JavaScript/TypeScript 汉字处理工具库,由 theajack 开发维护。该项目提供了丰富的汉字处理功能,包括拼音转换、笔画计算、繁简转换、成语查询、歇后语、偏旁部首、组词解释等,还支持汉字笔画动画绘制和语音合成功能。

该项目采用模块化设计,核心功能与扩展功能分离,开发者可以根据实际需求按需引入,有效控制包体积。

核心特性

  • 拼音转换:支持汉字转拼音、多音字处理、音调标注
  • 笔画计算:获取汉字笔画数、笔画顺序查询
  • 可视化绘制:汉字笔画动画、书写练习、测验功能
  • 繁简转换:简体、繁体、火星文互转
  • 成语歇后语:成语查询、歇后语匹配
  • 偏旁部首:查询汉字偏旁部首和结构
  • 语音功能:语音合成、语音识别、发音播放
  • 多环境支持:浏览器、Node.js、微信小程序

技术栈

  • TypeScript:主要开发语言,提供完整类型支持
  • JavaScript:兼容 ES5+ 环境
  • 模块化架构:支持 ES Module、CommonJS、UMD 等多种格式
  • 插件化设计:功能模块化,按需加载

安装指南

使用 npm 安装

基础库安装:

bash
npm i cnchar

安装全部功能(包含所有插件):

bash
npm i cnchar-all

按需安装特定功能:

bash
# 多音字支持
npm i cnchar-poly

# 笔画顺序
npm i cnchar-order

# 繁简转换
npm i cnchar-trad

# 汉字绘制
npm i cnchar-draw

# 成语功能
npm i cnchar-idiom

# 歇后语
npm i cnchar-xhy

# 偏旁部首
npm i cnchar-radical

# 组词功能
npm i cnchar-words

# 解释查询
npm i cnchar-explain

# 语音功能
npm i cnchar-voice

CDN 引入

html
<!-- 基础库 -->
<script src="https://fastly.jsdelivr.net/npm/cnchar/cnchar.min.js"></script>

<!-- 全部功能 -->
<script src="https://fastly.jsdelivr.net/npm/cnchar-all/cnchar.all.min.js"></script>

快速开始

浏览器环境

html
<script src="https://fastly.jsdelivr.net/npm/cnchar/cnchar.min.js"></script>
<script>
  // 获取拼音
  console.log('汉字'.spell()); // "hàn zì"

  // 获取笔画数
  console.log('汉字'.stroke()); // 11
</script>

ES Module

typescript
import cnchar from 'cnchar';
import 'cnchar-poly';  // 多音字支持
import 'cnchar-order'; // 笔画顺序

// 获取带音调的拼音
console.log(cnchar.spell('汉字', 'tone')); // "hàn zì"

// 获取笔画顺序
console.log(cnchar.stroke('汉字', 'order')); // ["撇", "点", "点", "撇", "横", "竖", "撇", "捺", "横折", "横", "竖"]

Node.js 环境

javascript
const cnchar = require('cnchar');
const poly = require('cnchar-poly');

cnchar.use(poly);

console.log('汉字'.spell()); // "hàn zì"
console.log(cnchar.spell('汉字')); // "hàn zì"

使用示例

拼音转换

javascript
import cnchar from 'cnchar';
import 'cnchar-poly';

// 基础拼音
'汉字'.spell(); // "han zi"

// 带音调
'汉字'.spell('tone'); // "hàn zì"

// 仅首字母
'汉字'.spell('first'); // "h z"

// 多音字处理
'长大'.spell('poly'); // "zhang da"

// 数组形式返回
'汉字'.spell('array'); // ["han", "zi"]

笔画计算

javascript
import cnchar from 'cnchar';
import 'cnchar-order';

// 获取笔画数
'汉字'.stroke(); // 11

// 获取笔画顺序
'汉'.stroke('order'); // ["点", "点", "提", "横撇", "捺"]

// 获取笔画顺序名称
'汉'.stroke('name'); // ["氵", "又"]

// 按笔画数查询汉字
cnchar.strokeToWord(8); // 返回所有8画的汉字

汉字可视化绘制

javascript
import cnchar from 'cnchar';
import 'cnchar-draw';

// 基础绘制
cnchar.draw('汉字', {
  el: '#draw-container'
});

// 动画模式
const writer = cnchar.draw('汉字', {
  el: '#draw-container',
  type: cnchar.draw.TYPE.ANIMATION,
  animation: {
    autoAnimate: true,
    loopAnimate: false
  }
});

// 控制动画
writer.startAnimation();
writer.pauseAnimation();
writer.resumeAnimation();

繁简转换

javascript
import cnchar from 'cnchar';
import 'cnchar-trad';

// 简体转繁体
cnchar.convert.simpleToTrad('汉字'); // "漢字"

// 简体转火星文
cnchar.convert.simpleToSpark('汉字'); // "漢牸"

// 繁体转简体
cnchar.convert.tradToSimple('漢字'); // "汉字"

成语查询

javascript
import cnchar from 'cnchar';
import 'cnchar-idiom';

// 根据汉字查询成语
cnchar.idiom(['五', '', '十', '']);
// ['五风十雨', '五光十色']

// 根据笔画数查询
cnchar.idiom([4, 6, 2, 0]);
// 返回第一字4画、第二字6画、第三字2画的成语

// 根据拼音查询
cnchar.idiom('shang4');
// ["上兵伐谋", "上不着天,下不着地", ...]

歇后语查询

javascript
import cnchar from 'cnchar';
import 'cnchar-xhy';

// 精确查询
cnchar.xhy('大水冲了龙王庙');
// ['大水冲了龙王庙-自家人不识自家人']

// 模糊查询
cnchar.xhy('大水', 'fuzzy');
// ['江河里长大水-泥沙俱下', ...]

// 只返回答案
cnchar.xhy('大水', 'fuzzy', 'answer');
// ['泥沙俱下', '后浪推前浪', ...]

偏旁部首查询

javascript
import cnchar from 'cnchar';
import 'cnchar-radical';

// 查询偏旁部首
cnchar.radical('汉字');
// [{ radical: '氵', struct: 'left-right', radicalCount: 3 }, ...]

// 查询汉字结构
cnchar.radical('森');
// [{ radical: '木', struct: 'top-bottom', radicalCount: 4 }]

语音功能

javascript
import cnchar from 'cnchar';
import 'cnchar-voice';

// 播放汉字发音
const player = cnchar.voice('汉字');
player.play();

// 语音合成(浏览器环境)
cnchar.voice.speak('你好,世界');

// 语音识别(浏览器环境)
cnchar.voice.regonize({
  onResult: (result) => {
    console.log('识别结果:', result);
  }
});

API 参考

核心 API

API功能示例
cnchar.spell()拼音转换cnchar.spell('汉字')
cnchar.stroke()笔画计算cnchar.stroke('汉字')
cnchar.convert繁简转换cnchar.convert.simpleToTrad()
cnchar.draw()可视化绘制cnchar.draw('汉字', options)
cnchar.idiom()成语查询cnchar.idiom(['五', '', '十', ''])
cnchar.xhy()歇后语cnchar.xhy('大水', 'fuzzy')
cnchar.radical()偏旁部首cnchar.radical('汉字')
cnchar.words()组词cnchar.words('你')
cnchar.explain()解释cnchar.explain('你好')
cnchar.voice()语音cnchar.voice('汉字')

工具方法

方法功能示例
cnchar.spellInfo()拼音详情cnchar.spellInfo('Shàng')
cnchar.transformTone()音调转换cnchar.transformTone('lv2')
cnchar.isCnChar()是否汉字cnchar.isCnChar('汉')
cnchar.isPolyWord()是否多音字cnchar.isPolyWord('长')
cnchar.compareSpell()比较拼音cnchar.compareSpell('ao', 'ai')
cnchar.compareStroke()比较笔画cnchar.compareStroke('你', '好')
cnchar.sortSpell()拼音排序cnchar.sortSpell(['你', '好', '吗'])
cnchar.sortStroke()笔画排序cnchar.sortStroke(['一', '三', '二'])

插件列表

插件名功能依赖
cnchar核心库(拼音、笔画数)-
cnchar-poly多音字支持cnchar
cnchar-order笔画顺序cnchar
cnchar-trad繁简转换cnchar
cnchar-draw可视化绘制-
cnchar-idiom成语-
cnchar-xhy歇后语-
cnchar-radical偏旁部首-
cnchar-words组词-
cnchar-explain解释-
cnchar-voice语音-
cnchar-random随机汉字-
cnchar-code编码-
cnchar-input输入法-
cnchar-info信息-
cnchar-name姓名-

项目链接

分享: