Olá, estou tentando usar o react-ace em um projeto meu e não consigo fazer com que o preenchimento automático ou os snippets funcionem.
Meu método de renderização é o seguinte:
render(): JSX.Element {
return (<>
<ContentPage>
<AceEditor
placeholder="Placeholder Text"
mode="html"
theme="monokai"
name="blah2"
width="inherit"
onChange={this.onCodeChange}
fontSize={14}
showPrintMargin={true}
showGutter={true}
highlightActiveLine={true}
setOptions={{
enableBasicAutocompletion: true,
enableLiveAutocompletion: true,
enableSnippets: true,
showLineNumbers: true,
tabSize: 2
}}
/>
</ContentPage>
</>);
}
e minhas importações são:
import AceEditor from "react-ace";
import "ace-builds/src-noconflict/mode-html";
import "ace-builds/src-noconflict/theme-monokai";
A página carrega bem e o editor trabalha com realce de sintaxe, mas não consigo a caixa de diálogo autocomplete / snippet.
Os únicos avisos que estou recebendo são (o que parece ser o problema):
ace.js:4316 misspelled option "enableBasicAutocompletion"
warn @ ace.js:4316
ace.js:4316 misspelled option "enableLiveAutocompletion"
warn @ ace.js:4316
ace.js:4316 misspelled option "enableSnippets"
Qualquer ajuda seria ótimo, obrigado!
carregar a extensão de ferramentas de linguagem import "ace-builds/src-noconflict/ext-language_tools";
para carregar e fazer com que essas opções funcionem.
Fixo! Muito obrigado @nightwing !
Criei um PR para atualizar os documentos com este caso de uso, pois imagino que outros possam se deparar com o mesmo.
Comentários muito úteis
carregar a extensão de ferramentas de linguagem
import "ace-builds/src-noconflict/ext-language_tools";
para carregar e fazer com que essas opções funcionem.