使用Elm突出顯示語法

我正在編寫一個簡單的應用程序，它提供了一個語法突出顯示的代碼塊。現在我正在使用highlightjs做爲我的語法突出顯示。使用Elm突出顯示語法

爲什麼我的電話highlightBlock在這裏工作？

對於細心的讀者：我選擇的Model和Msg是完全荒謬的，因爲我真的不馬上使用它們。

import Html exposing (..) 
import Html.App as Html 
import Html.Attributes exposing (..) 

main = 
    Html.program 
    { init = init 
    , view = view 
    , update = update 
    , subscriptions = subscriptions 
    } 

-- Model 

type alias Model = { state: Int } 

init : (Model, Cmd Msg) 
init = (Model 1, Cmd.none) 

-- view 

view : Model -> Html Msg 
view model = div [ ] [ codesample ] 

codesample : Html Msg 
codesample = pre [ myStyle ] [ code [] [ Html.text thisCode ] ] 

myStyle : Html.Attribute Msg 
myStyle = Html.Attributes.style [("background-color", "#F0F0F0"), ("width", "500px")] 

thisCode : String 
thisCode = """ 
import Html exposing (..) 
import Html.App as Html 
import Html.Events exposing (..) 
import Random 
import Svg exposing (..) 

main = 
    Html.program 
    { init = init 
    , view = view 
    , update = update 
    , subscriptions = subscriptions 
    } 
""" 

-- update 


type Msg 
    = Roll | NewFace Int 

update : Msg -> Model -> (Model, Cmd Msg) 
update msg model = (model , Cmd.none) 

-- subscriptions 

subscriptions : Model -> Sub Msg 
subscriptions model = Sub.none

有一次，我打電話highlightjs我都加大純榆木的範圍之內。我下載榆樹語法高亮包和調用庫，但沒有如下...我懷疑端口將是必要的（上鬆弛提到）

<html> 
<head> 
<link rel="stylesheet" href="styles/solarized-dark.css"> 
<script src="highlight.pack.js"></script> 
</head> 
<body> 

<div id="my-elm-block"></div> 
<script src="block.js"></script> 
<script> 
    var node = document.getElementById("my-elm-block"); 
    var app = Elm.Main.embed(node); 
    hljs.highlightBlock(node); 

</script> 
</body> 
</html>

來源

2016-07-01 john mangual

有沒有問題，我看不到？ – revo

@revo你看不到它 –

感謝編輯歷史，你只是把問題放在那裏，謝天謝地，我不盲目！ – revo

出於某種原因，呼籲通過榆樹產生的DOM功能直接調用embed後不起作用，但是如果你在很短暫的時間內將它包裝起來，它會的。改變你的高潮線：

setTimeout(function() { hljs.highlightBlock(node); }, 1);

我不得不使用這個黑客多次，並沒有問題。

來源

2016-07-01 16:33:09

「ondomcontentloaded」之類的東西呢？或者只是超時的'0'值，所以它被放在callstack的末尾，沒有一個神奇的毫秒值。 – Seth

使用Elm突出顯示語法

回答

相關問題