如何在 Vue 中正确使用 Ace Editor?

How to use Ace Editor in correct way with Vue?

我正在从事的一个项目要求我在网站中包含一个代码编辑器。最推荐/最受欢迎的编辑器是 ACE 编辑器。在浏览一些示例代码时,有人提到使用 browserify 的 ACE 是一种更好的前进方式。但是我不明白 thlorenz 使用 ACE API 和 browserify ACE 包的确切区别。

我尝试了 Brace 存储库 (https://github.com/thlorenz/brace/tree/master/example) 中给出的示例代码,但无法理解如何将其正确包含在 Vue。例如,如果我根据用户输入更改语言,如何更改 ACE 模式。

一些演示 Core ACE API 与 Vue 结合使用的 Pens 或 JsFiddles 会非常有帮助。也是将 browserify 与 ACE 结合使用的原因。

您可以使用 ace-builds npm 包而不是类似于 https://github.com/nightwing/ace-webpack-demo

的大括号
var ace = require("ace-builds")
require("ace-builds/webpack-resolver");