效果（Gif）

仓库地址

背景

在程序员的世界里，只要习惯用 Git，写文章必然就是 Markdown 了。

近来几天，重新玩起了微信公众号，最不能忍受的就是那个编辑器，效率很低。虽然微信现在已经提供了模板功能，但是对于喜欢多平台发文的程序员来讲，维护多个内容成本过高。

现状

了解了目前市场上主流的编辑器：

结论是：都不是我想要的。

这几个编辑器都是偏向推广玩法的类型，过于花俏。好一点的模板也基本都是收费的，所以只能放弃。

转变

经过 Google 几下，发现微信编辑器是可以直接复制 HTML 代码块，这就给我们提供了更多可能。

既然常规主流的玩法无法满足需求，那我就换了一个思路：继续 Markdown 书写，然后借用转换器转换

我开始换关键字搜索：React markdown 组件

运气

在搜索的过程中我偶然遇到了：markdown-nice

  1. 简介
  2. 支持自定义样式的 Markdown 编辑器
  3. 支持微信公众号排版
  4. 支持知乎、稀土掘金、博客园和CSDN等一系列平台
  5. 内容和自定义样式浏览器中实时保存
  6. 可在工具中提交自定义主题
  7. 支持上传图片、脚注、公式

因为用了 antd，所以看起来非常简洁，但是也因此非常庞大，但是这一点能接受。

需求

研究了作者提供了几个主题，发现彼此审美上有偏差，自己实在忍受不了，所以就 fork 了一份，开始大面积调整。

  1. 添加了一个 CDK8S 主题
  2. 调整默认主题为 CDK8S
  3. 调整默认配色为 atomOneLight
  4. 添加开关 `IS_STYLE_READ_CACHE_OPEN` 默认主题从 localstorage 读取
  5. 修改图床上传接口，改为私有服务的 API
  6. 去掉第一次加载弹出的更新弹窗

因为 CDK8S 这个关键字是唯一的，所以大家可以参考我的方式，自己定制自己的需求。

感谢

程序员的专属微信公众号编辑器：定制 Markdown 转 HTML的更多相关文章

  1. C# 实现生成带二维码的专属微信公众号推广海报

    原文:C# 实现生成带二维码的专属微信公众号推广海报 很多微信公众号中需要生成推广海报的功能,粉丝获得专属海报后可以分享到朋友圈或发给朋友,为公众号代言邀请好友即可获取奖励的.海报自带渠道二维码,粉丝 ...

  2. 微信小程序跳转到微信公众号

    我这里是uniapp里的操作 微信开发者工具配置 微信小程序官网地址:official-account 公众号关注组件. 当用户扫小程序码打开小程序时,开发者可在小程序内配置公众号关注组件,方便用户快 ...

  3. 微信小程序内链微信公众号的方法

    最近接了一个需求,要求在微信小程序内部添加关注微信公众号的方式并给出解决方案,经过几天的翻官网文档,查周边资料,问资深技术员,初步给出两个解决方案: 题外话: 搬砖容易,建设难,搬砖的小伙伴请注明文章 ...

  4. 微信公众号Makrdown编辑器，语法你懂吗？

    感谢 WeChat Format 源码: https://github.com/lyricat/wechat-format! 其他工具推荐: 微信公众号编辑器 Makrdown: https://md ...

  5. ASP.NET Core2实现静默获取微信公众号的用户OpenId

    最近在做个微信公众号的项目,需要将入口放置在公众号二级菜单内,通过点击该菜单链接后进入到该项目中去,进入到项目后程序会自动通过微信公众号的API完成用户的OpenId获取.需求很简单,实现起来也不复杂 ...

  6. 微信公众号开发系列-13、基于RDIFramework.NET框架整合微信开发应用效果展示

    1.前言 通过前面一系列文章的学习,我们对微信公众号开发已经有了一个比较深入和全面的了解. 微信公众号开发为企业解决那些问题呢? 我们经常看到微信公众号定制开发.微信公众平台定制开发,都不知道这些能给 ...

  7. 14-网页,网站,微信公众号基础入门(网页版MQTT,小试牛刀)

    https://www.cnblogs.com/yangfengwu/p/11192639.html 抱歉哈...最近由于做板子,,教程的进度落下了... 这些天总共做了还几块板子 首先对当前这个教程 ...

  8. 使用小书匠及markdown here编辑博客和微信公众号

    1. 使用小书匠连接Evernote并发布笔记到博客园 1.1 小书匠初探 我平时的信息收集的主要方法是采用Pocket+Evernote. 简单来说: 如果访问到非常有用,而且是必须要立刻记录的内容 ...

  9. [python]通过微信公众号“Python程序员”，编写python代码

    今天发现微信公众号中,居然可以编写python代码,很是惊喜,觉得蛮有趣的. 步骤如下: 1.关注微信公众号“Python程序员” 2.关注成功后,点击右下角的“潘多拉”->"Pyth ...

随机推荐

  1. py+selenium一个可被调用的登录测试脚本【待优化】

    大部分系统现在都有登录页面,本文主要尝试写一个登录的测试脚本,及另一个脚本调用它登录测试已登录的页面模块. 目标: 登录脚本:从excel里获取登录的测试数据(包括异常测试)→执行登录脚本→输出是否通 ...

  2. Excel催化剂开源第48波-Excel与PowerBIDeskTop互通互联之第二篇

    前一篇的分享中,主要谈到Excel透视表连接PowerBIDeskTop的技术,在访问SSAS模型时,不止可以使用透视表的方式访问,更可以发数据模型发起DAX或MDX查询,返回一个结果表数据,较透视表 ...

  3. vue 的基本语法和常用指令

    什么是vue.js Vue.js是目前最火的一个前端框架,React是最流行的一个前端框架(React除了开发网站,还可以开发手机App, Vue语法也是可以用于进行手机App开发的,需要借助于Wee ...

  4. SQL SERVER Suspect(质疑/挂起) 状态恢复

    数据库服务器,在断电时,偶尔会出现Suspect状态,导致数据库无法使用. 解决办法如下: 数据库名带‘[]’可以避免库名中带‘.’等特殊符号的情况. USE [master]GOALTER DATA ...

  5. layui上传Excel更新数据并下载

    前言: 最近做项目遇到了一个需求,上传Excel获取数据更新Excel文档,并直接返回更新完的Excel到前端下载:其实需求并没有什么问题,关键是前端用到的是layui上传组件(layui.uploa ...

  6. 或许是你应该了解的一些 ASP.NET Core Web API 使用小技巧

    一.前言 在目前的软件开发的潮流中,不管是前后端分离还是服务化改造,后端更多的是通过构建 API 接口服务从而为 web.app.desktop 等各种客户端提供业务支持,如何构建一个符合规范.容易理 ...

  7. Android利用Handler异步获取子线程中的产生的值

        本文首发于cartoon的博客     转载请注明出处:https://cartoonyu.github.io/cartoon-blog     近段时间有一个需求:在线获取图片并且显示在界面 ...

  8. LeetCode 138：复制带随机指针的链表 Copy List with Random Pointer

    给定一个链表,每个节点包含一个额外增加的随机指针,该指针可以指向链表中的任何节点或空节点. 要求返回这个链表的深拷贝. A linked list is given such that each no ...

  9. 日常用shell命令

    递归更改文件夹权限:chmod -R 767 文件名 mac启动apache sudo apachectl start/restart mac停止apache sudo apachectl stop ...

  10. RocketMQ中NameServer的启动

    在RocketMQ中,使用NamesrvStartup作为启动类 主函数作为其启动的入口: public static void main(String[] args) { main0(args); ...