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

Question

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

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

展示在 Vue 中使用 Core ACE API 的一些 Pen 或 JsFiddles 将非常有帮助。也是在 ACE 中使用 browserify 的原因。

Answer 1

您可以使用ace-builds npm 包代替类似于https://github.com/nightwing/ace-webpack-demo 的大括号

var ace = require("ace-builds")
require("ace-builds/webpack-resolver");