自制体积不到 2kB 的代码编辑器，areaEditor.js，增强 textarea 标签的代码编辑体验

目录

• 起因
  
• 快速使用
  
• 缩进功能
  
• 缩进类型
  
• 自动补全括号
  
• 犯难
  
• 自动补全
  
• 阻止补全
  
• 编辑框抖动
  
• 在空行按下删除键，清空
  
• 封装代码
  
• 怎么压缩 JavaScript 代码
  
• 更多的功能？
  

起因

前两天我搞的那个在线 HTML 新标签页预览功能 https://www.cnblogs.com/duyuanshang/p/18829312 ，很好用，最近在我工作上帮了很大的忙，它可以让我不用打开本地代码编辑器就能快速调试一些前端代码，我也逐步完善它的了很多功能。可是，很快它就有了一个问题： 使用  写代码很不舒服。
当然，使用它来接受粘贴过后的代码还好，如果想再编辑一下、删删改改调整调整缩进，那简直难受死了。
最显而易见的解决方案，是使用一个第三方的 在线代码编辑器 的 js 库，像如 Code Mirror 或 Ace 这些成熟又著名的编辑器，可是..... 它们体积有点大，虽然大力压缩处理后也不过 100kb 左右，但依然重量级。
在很久以前，我就感觉到代码编辑框的重要性了，很多前端页面都会有在线写一些脚本的需求，如果使用频率非常高的话一般就引入第三方库了，但我真的不想引入，觉得德不配位，于是我看着那个 textarea 框开始发呆。我在想，有没有办法能让它在写代码时，体验好一点。

于是这几天我就捣鼓了一个很迷你的 js 库，https://github.com/kohunglee/areaEditor  areaEditor.js，用着还真挺舒服。这个是一个演示 ： https://www.ccgxk.com/areaEditor.html  ，欢迎赏个 star ，谢谢您 Thanks♪(･ω･)ﾉ

  
来源：程序园用户自行投稿发布，如果侵权，请联系站长删除
免责声明：如果侵犯了您的权益，请联系站长，我们会及时删除侵权内容，谢谢合作！