wedit 是一个基于 Web 的 JavaScript 编辑器，采用了 CodeMirror 编辑器作为底层，提供了类似于 Sublime Text 的编辑器体验。该编辑器非常灵活，也非常易于集成到你的项目中。
安装
使用 npm 安装 wedit 包：
npm install wedit --save
引入编辑器
在你的 HTML 文件中引入 wedit 的样式和脚本：
<link rel="stylesheet" href="/path/to/wedit.css"> <script src="/path/to/wedit.js"></script>
在需要使用编辑器的地方，创建一个容器：
<div id="editor"></div>
初始化编辑器
使用 wedit.create() 函数来创建一个编辑器实例：
var editor = wedit.create(document.getElementById('editor'), {
value: ''
});第一个参数为容器元素，第二个参数为配置项，可以指定编辑器的一些行为和特性。
配置项
以下是一些常用的配置项：
value: 编辑器默认内容（字符串）mode: 编辑器默认语言（字符串）tabSize: 编辑器默认制表符大小（整数）lineNumbers: 是否显示行号（布尔值）lineWrapping: 是否自动换行（布尔值）readOnly: 是否只读（布尔值）theme: 编辑器主题（字符串）
方法
编辑器实例提供了一些方法，可以在代码中调用来实现一些操作。
getValue(): 获取编辑器内容setValue(value): 设置编辑器内容focus(): 让编辑器获得焦点blur(): 让编辑器失去焦点refresh(): 刷新编辑器
事件
编辑器实例还提供了一些事件，可以在代码中监听并处理。
change: 当编辑器内容发生改变时触发scroll: 当编辑器滚动时触发
示例代码
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------ ----------
----- ---------------- --------------------------
------- ---------------------------------
-------
------
---- ------------------
--------
--- ------ - ----------------------------------------------- -
------ --------- ------- --- ------------------ --------------
----- -------------
------------ -----
------------- -----
--------- ------
------ ---------
---
------------------- ---------- -
-------------------------------
---
---------
-------
-------总结
wedit 作为一个成熟的 JavaScript 编辑器，提供了非常多的功能和定制化选项。通过上述教程，我们可以轻松地将这个编辑器引入我们的项目中，并且根据需要进行配置和扩展。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6006710a8dd3466f61ffe089