使用Codemirror做了一个Web在线编辑器，支持Vue、React、Es6、TypeScript等各种前端预处理器—真香！

做一个简单的前端在线编辑器是比较简单的事，最近接触发现，还是CodeSandbox强大啊！不能比啊，所以自己就做了一个不是非常复杂但是非常实用，包含了目前前端的各种解析器+功能的一个在线编辑器！

技术选型：

了解几个现在的编辑器，接触到的有：codemirror、ace、还有一个忘记名字了，最后还是选择了codemirror，感觉上手容易点。

前端就vue+codemirror，后端就express+mysql+redis搞定了整个编辑器；

预处理HTML：Pug、Markdown、Haml

CSS预编译：Stylus、SCSS、Sass、Less

Javascript：Babel、TypeScript、Module 模式

这些个功能对应找官方的插件就好了，后端来实现接口这样就可以完美支持了！

支持保存自己的代码，同时也支持 Embed嵌入到第三方网页里面。个人觉得还是很实用的！

不过实现的过程中还是遇到很多问题的，以后有空再写出来吧！

最后，欢迎大家体验和提需求哈，谢谢！送上地址下面！

在线代码编辑器：https://animpen.com/pen/