Question

问题：

当我在文本字符串中获取HTML字符串并插入/或设置ACE.js编辑器值，并使用美化来整理/缩进代码时，但它无法正常工作，我想知道是否{{1 ACE.js提供的是支持html，css，js美化？我在这做错了什么？

ext-beautify.js

ACE.js编辑器上的输出

var htmlString = "<div class="row"><div class="col-sm-12"><span>chrome</span></div></div>";

var editor = ace.edit("editor");
editor.session.setMode("ace/mode/html");
editor.session.setValue(htmlString);

var beautify = ace.require("ace/ext/beautify");
beautify.beautify(editor.session);

但我需要它

<div class="row"><div class="col-sm-12"><span>chrome</span></div></div>

有任何建议或解决方案吗？

Answer 1

我也尝试了ace编辑器的美化扩展，它也不适用于我，输出只是单行。我经历了JS Beautifier，它的工作非常好。它有美化JS，HTML和CSS的选项。您可以使用HTML模块在Ace Editor中美化您的代码。我在下面附上了示例代码：

HTML：

<div id="editor"></div>

JS：

var htmlString = '<div class="row"><div class="col-sm-12"><span>chrome</span></div></div><div class="row"><div class="col-sm-12"><span>mozilla</span></div></div>';
htmlString = html_beautify(htmlString);

var editor = ace.edit("editor");
editor.setTheme("ace/theme/monokai");
editor.session.setMode("ace/mode/html");
editor.session.setValue(htmlString);

正在运行Fiddle链接。

ACE.js代码编辑器如何使用美化HTML，CSS，JS

1 个答案: