function foo(items) { var x = "All this is syntax highlighted"; retur" /> function foo(items) { var x = "All this is syntax highlighted"; retur" /> function foo(items) { var x = "All this is syntax highlighted"; retur"/>

How to add Ace code editor to a sphinx page?

63 Views Asked by At

I have the following RST file:

Title
=====


.. raw:: html

    <body>

    <div id="editor">function foo(items) {
        var x = "All this is syntax highlighted";
        return x;
    }</div>
        
    <script src="./src-noconflict/ace.js" type="text/javascript" charset="utf-8"></script>
    <script>
        var editor = ace.edit("editor");
        editor.setTheme("ace/theme/monokai");
        editor.session.setMode("ace/mode/javascript");
    </script>
    </body>
    

I want to add the ace code editor into my sphinx page but no matter what I try the editor does not render and will tell me the following error: "Uncaught ReferenceError: ace is not defined", I believe this is because of error I get before: Failed to load resource: the server responded with a status of 404 (Not Found). Sphinx is not able to find ace.js in the directory I chose for ace. Which is src-noconflict. I have the following directory:

root_folder
   ...
   src-noconflict/... (ace.js is in this folder)
   content/folder1/folder2/folder3/folder4/my_page.rst
   ...

How can I add the ace-editor to my sphinx page?

0

There are 0 best solutions below