Custom Html/Css when using Elm reactor

466 views
Skip to first unread message

Ronn Ross

unread,
Dec 1, 2015, 7:21:50 PM12/1/15
to Elm Discuss
Hello, I'm new to Elm and I'm having trouble with adding custom html/css to Elm reactor. I'm able to run 
elm-reactor 
with no issue and when I navigate to localhost:8000 I see a list of all my files (.elm, .css, .html). I'm able to click on the name of an .elm file and see it run in the browser without styles. Likewise I can click the wrench and see same page (no css) with time travel debugging. Neither of these pages allow for hot-swapping. I have to manually refresh to see my changes. 

If I click on my index.html file I see the app as a whole, but when I make changes elm-reactor does not rebuild my code. 

I added 
  <script type="text/javascript" src="/_reactor/debug.js"></script>
and 
var app = Elm.fullscreenDebug('app', 'App.elm'); 

This help with the css and time travel debugging, but not hot-swapping. In fact elm doesn't build my files at all. 

Is there a way to get hot-swapping, time travel debugging, and css all working together? 

Kurt Harriger

unread,
Dec 1, 2015, 8:21:53 PM12/1/15
to Elm Discuss
Hot swapping does not work for me either. I am using OS X and there appears to be at least one known issue with hot swapping on the mac:

https://github.com/elm-lang/elm-reactor/issues/168

So if you are on OS X it might be that?

Reactor doesn't support external css yet.

https://github.com/elm-lang/elm-reactor/issues/152

I have gotten time travel to partially work. I can rewind time but after rewinding, the program would no longer accept new input. Not sure if this is known issue or some self inflicted problem yet.


--
You received this message because you are subscribed to the Google Groups "Elm Discuss" group.
To unsubscribe from this group and stop receiving emails from it, send an email to elm-discuss...@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Alexey Zlobin

unread,
Dec 2, 2015, 4:37:49 PM12/2/15
to elm-d...@googlegroups.com
I'm working with Elm in LMDE + Chrome environment. And hot swapping doesn't work there.

I think the right question is: what parts of reactor work when we use HTML instead of plain Elm?

Noah Hall

unread,
Dec 2, 2015, 5:21:34 PM12/2/15
to elm-d...@googlegroups.com
It's possible currently with reactor by adding a stylesheet tag for
HTML - see an example here
https://github.com/eeue56/css-reactor/blob/master/Main.elm

It doesn't refresh when your CSS changes, but it does when your Elm changes.

Noah Hall

unread,
Dec 2, 2015, 5:27:58 PM12/2/15
to elm-d...@googlegroups.com
Ah, sorry - I see this is to do with hotswapping. It'll remove the
need for a HTML file though, at least

Ronn Ross

unread,
Dec 2, 2015, 7:24:56 PM12/2/15
to elm-d...@googlegroups.com
Noah,
That actually helps a lot. That solved one of my big issues of not being able to style pages when using elm reactor. I think hot swapping might be solved over here https://github.com/elm-lang/elm-reactor/issues/168. Thanks for your help. 

You received this message because you are subscribed to a topic in the Google Groups "Elm Discuss" group.
To unsubscribe from this topic, visit https://groups.google.com/d/topic/elm-discuss/WI0Wr6bs2a4/unsubscribe.
To unsubscribe from this group and all its topics, send an email to elm-discuss...@googlegroups.com.

Alexey Zlobin

unread,
Dec 3, 2015, 4:06:21 AM12/3/15
to elm-d...@googlegroups.com
Looks good. If I link javascript with port handling will it work?
Reply all
Reply to author
Forward
0 new messages