Есть ли встраиваемый редактор кода для Elm?

Question

Я хочу иметь виджет редактора кода, такой как CodeMirror или Ace, на моей веб-странице Elm. К сожалению, CodeMirror и Ace не работают с Elm, поскольку они модифицируют DOM (по крайней мере, я так понимаю, почему они не работают).

Мне нужно что-то хотя бы лучше чем <textarea> для студентов, чтобы представить код. И для нас, чтобы отобразить код. Просто автоматическое отступление и подсветка синтаксиса на данный момент.

Answer 1

Я лично нашел Elm-Ace очень полезным.

Требуется некоторый нативный код, поэтому вы не сможете установить его с elm package install, Вместо этого скопируйте соответствующее исходное дерево в свое и измените elm-package.json включать "native-modules": true как это

При использовании этой библиотеки убедитесь, что вы добавили вручную ace.js в index.html,

Получив эту настройку, вы можете получить редактор кода следующим образом:

view : Model -> Html Msg
view model =
    div []
        [ Ace.toHtml
            [ Ace.onSourceChange UpdateSource
            , Ace.value model.source
            , Ace.mode "lua"
            , Ace.theme model.theme
            , Ace.enableBasicAutocompletion True
            , Ace.enableLiveAutocompletion True
            , Ace.enableSnippets True
            , Ace.tabSize 2
            , Ace.useSoftTabs False
            , Ace.extensions [ "language_tools" ]
            ]
            []
        ]

Answer 2

Я не уверен, что это встраиваемо, но я слышал много хорошего об Элли. Другим соображением может быть редактор Monaco, который, как я считаю, послужил основой для продукта Microsoft VSCode, а также редактор кода, встроенный в некоторые части Microsoft Azure.