你好~ 我是小斑.docx

《你好~ 我是小斑.docx》由会员分享，可在线阅读，更多相关《你好~ 我是小斑.docx（5页珍藏版）》请在得力文库 - 分享文档赚钱的网站上搜索。

1、又一个编辑器?编辑器的世界里，前辈众多，知名编辑器比比皆是Word、Page、Idea、Mscodc等 等，但大阵营可以分为两个： 纯文本编辑器-只能输入字符的编辑器，程序员电脑里的QE,大多属 于这一类； 富文本编辑器-可以进行图文的混排，功能丰富，文字有单独样式、格式的编辑器，主要活跃与Web端；纯文本编辑常被用来写程序，但其中却有个身在曹营心在汉的异类：Markdown编 辑器，这类编辑器虽说只能输入文字，样式也单一，但生成的内容却可以和富文 本编辑器媲美。另一类，便是富文本编辑器了，顺便提一下，小斑我也是富文本编辑器，流行于Web端的富文本编辑器有很多，但我的主人为什么还要费力心思造小

2、斑呢？ 这就得请我的主人来说道说道了，下面有请阿飞先生来讲述讲述。咳咳！不是说自我介绍的任务交给你了嘛我已经和你说过啦，你自己来吧！老大，你怎么还害羞上了。那行，我自己来！故事发生在一个月黑风高的夜晚，只有主人面前的电脑亮着，电脑屏幕里不知放着什么，阴暗的屏幕上有一口很深的井，突然”小斑！好好好!那我正式开始了！不得已的妥协其实吧，最早的时候，大概3年前，我还不存在，老大想找个称手的富文本编辑器来搭自己的博客，谁让老大是个程序员，最大的特点就是喜欢折腾，奈何3 年前的老大还是只小菜鸡，没有能力自己弄一个博客系统，看了一遍市场上成熟 的博客框架后，选了纽混这个简约的博客系统，也结识上了 Mark

3、dow八这门干 练的语言。但没过多久，老大他就开始哗哗了：”作为一个前端，连个图文混排的博客都没有，太 Low 了！接着就开始折腾，刚开始，他只是想简单的增强以到达自己想要的效果，一顿写MarkWow八年的插件，但是增强来增强去，还是不爽，毕竟编辑Markdow八时是没有效果的（当然，双屏+同步滚动是个不错的解决方案），牢骚话也变成了：我都在公司面对了一天的纯文本编辑器，回来写博客还得面对纯文本，写点东西可太不容易了。哎！没得方法，富文本编辑器必须得搞起来，老大也不想再造轮子，综合考虑试 用下来，最终还是做出了决定：那就是造一个！ ！但话得说说清楚：别的编辑器 也很不错，但却并没有满足老大的需

4、求，就比方老大在折腾期间选中的一款富文 本：PraftJSoDraftJsDrafts如它的名字一样：草稿，在记事方面，绝对的够用，但对于生成网页来说， 却有几个痛点： 图片不能连着放，中间的空行删除不了；图片不能塞到文字中，老大那一大箱的表情包可都用不了了，虽说老大还 是通过曲线救国的方式给添加上了； 不能生成Markdown ,虽说能生成,但是结构复杂，语法不如Markdown来的简洁干练; Table表格，不支持；文字的样式输入截断不了，比方光标输入前的字符是加粗的那么之后的文 字永远都是加粗的状态，不能截断样式，有点难受； 相信这些，知乎的前端大佬们应该很懂，老大看了他们的编辑器，用的

5、就是Dr姬Js ,想必塞由公式生成图片费了不少劲吧其实老大那时也还没开始重复造个轮子（没准是实力不够呢！加开5源码，并翻译了整个Drafts文档后，写了个Draft-X用于增强Dm化4但是没过多久，还是不爽！（可真是难伺候思前想后，老大决定放弃D*Js在看看别的富文本编辑器，或自己从头写一个。决定在重新找一个编辑器之前，老大列了下自己的需求： 样式能够完全的自定义（至少对于编辑器开发者而言）； 直接添加样式还不够,还要加起来方便，比方宽度的修改直接拖动角标等; 文字和图片能连续排放，表情包必须安排上； 文字样式能截断，输入空格后，文字还原为默认样式； 必须支持Table; 最好还能直接像Hig

6、hlight那样，通过修改Css ,直接定制文章的整体样式; 既然提到了 Highlight那代码块要支持高亮； 当然，其他的一切都要向别的编辑器靠齐；最后，也是很重要的一点：与MqrkWow八要有互动:1 .直接导入Markdown文件；.支持导出Mn-kdow八文件；.支持直接复制Markdown文本；. Markdow八支持的内容，编辑器必须要支持，编辑器的功能应该是 大于等于Markdown的；大概也就这么多吧多吗？ ？ ？不多吧！ ！ ！ “不多不多带着这些要求，老大看遍了目前能搜到的富文本编辑器，与预期的功能相比，都 差了一两点。 TiiyMCE CKEdit、UEditor WM

7、gE力to匕之类的富文本编辑器为纯编 辑器，是对2出戊力,仅加容器的增强，它们很优秀，但却不符合老大的 要求，老大理想中的富文本编辑器是能生成别的内容，不只是HtM,比 如Markdown ,因此内容必须是由JnvaScnpt来控制。这点还真不是老大 挑，试想一下，如果你写错了一个字，是在用词里找容易呢，还是 在Mqrkdow八里容易，而且如果内容由JavaSc呻土控制，没准，还能生成 别的东西！比方说小程序的页面？不过这都是后话了，但这一切实现的基 础就是内容在自己的掌控范围内！因此，这点其实还挺重要的！ Quill、DraftUs内容由JavaSc呻t控制，但是功能有点不够用，最重要的原

8、因是不支持Table；当然，以上两类都可以通过一些曲线救国的方法来支持老大的想法，比方 在TingMCE上加一个解析器，生成抽象语法树后，在生成别的内容，或是 继续增强DR化Js。思来想去，3个月前，老大决定：要做就做最正确的事，做 一个连一个字符都在自己掌控中的编辑器，这样无论自己想干什么，都能实现。 于是，3个月后，小斑正式诞生！能干嘛？我是小斑，一个功能完整且丰富的富文本编辑器，相关的说明文档就在我的编辑 器里，翻开就能见到，说明书即是了解小斑的途径，也是能够编辑的哦，放心大 胆的去改吧，说明书随便改，小斑并不会保存。想恢复？刷新一下就好啦！也希 望大家好好阅读后再开始探索哦在这简单的谈

9、谈我的特点和强大的功能吧：1 .使用但不依赖于皿戊八%靛“比容器，简单来说，老大只用了该容器的光 标用于定位输入或是操作的位置，其他的内容一概不用（包括文章历史栈 的管理），也就是说：如果哪天老大想把光标也折腾折腾，那 么c。也也Aitablc容器大概会被老大抛弃吧；2 .内容完全由JavaSm网所控制，小到一个字符，只要配合适当的生成器，就能生成所需要的内容（目前能生成HtT和Markdown）;.样式随意添加，小斑的核心完全支持，但对于一个面向用户的小斑而言, 老大考虑后，提供操作，但未开放；3 .与Markdowh有着良好的互动，包括直接翻开，导入导出，直接复制Markdown内容；.快

10、捷生成，小斑有一套完整的快速生成指令，在空行内直接输入指令，按 下Tab键即可快速生成段落类型，并且这些指令与MarkAown的标记完全一致，比方在空行输入#键，在按下了必键，就能直接生成一级标题，当 然详细内容请参考说明书；4 .代码由修0人购向进行高亮，编辑与高亮同步进行；5 .文章可设置主题，一键修改文章的整体呈现；6 .支持PWA,使用CkroMC翻开，地址栏右侧会有+号哦，点击一下就会生本钱地应用，只要不切换代码和文章主题，没网也能用!接下来接下来，老大想把小斑诞生过程中遇到的一些问题，以及整体的架构给好好梳理 一下，并记录下来。这局部老大已经全权交给我整理了！那我就不客气了，偷偷告诉大家，我的内部 是一个井然有序的世界，各个部门担任着各自的职责，忙碌而有序。好啦！今天口得吧唱的说了这么久，也是希望大家能多多使用我，爱你们哟哦！对了，为了防止使用低版本的浏览器时，造成问题，小斑主动做了浏览器版 本校验，请把浏览器升级到最高版本哦ps:生成的文章不受浏览器版本影响。本文由ZcbHaEditor编辑并生成，我是小斑，我为自己带盐。