Create an example application with hot reloading and backend

[cquiroz]

[fdietze]

You can combine the hot reloading as described in https://github.com/scalacenter/scalajs-bundler/issues/180#issuecomment-378008812

with https://github.com/spray/sbt-revolver

Working example here: https://github.com/woost/wust2/blob/master/build.sbt#L154

[cquiroz]

Thanks, we should put a few examples on the documentation. I'd add a link to your example

[edadma]

https://github.com/woost/wust2/blob/master/build.sbt#L154 doesn't exist.

Please explain how to use Spray revolver with Scala.js - would be very helpful for node app development

[evbo]

in ./project/plugins.sbt:

addSbtPlugin("org.scala-js" % "sbt-scalajs" % "1.5.1")
addSbtPlugin("ch.epfl.scala" % "sbt-scalajs-bundler" % "0.20.0")
addSbtPlugin("io.spray" % "sbt-revolver" % "0.9.1")

in your build.sbt:

    version in webpack := "4.44.2",
    version in startWebpackDevServer := "3.11.2",

    webpackDevServerPort := 8180,

    // copies all resource files to a flat output directory
    webpackResources := resourceDirectory.in(Compile).value ** "*" filter { _.isFile },

    // forms a webpack folder containing all webpack config files (e.g. I like to follow java convention, storing in resources folder)
    webpackConfigFile in fastOptJS := Some(resourceDirectory.in(Compile).value / "webpack" / "webpack-fastopt.config.js"),
    webpackConfigFile in fullOptJS := Some(resourceDirectory.in(Compile).value / "webpack" / "webpack-fullopt.config.js"),

    // OPTIONAL: poll for filesystem changes every 5 seconds (good for a slow CPU and patient developer):
    pollInterval := 5.seconds,
    // OPTIONAL: do not allow the same file to trigger reload more than once per 60 seconds
    watchAntiEntropy := 60.seconds,

    // just google "trigger execution" for more fun options SBT has to offer...

in your fastopt (development only) webpack config, import webpack and add the plugin (or run with inline --hot, as documented elsewhere): new webpack.HotModuleReplacementPlugin()

Now start with reload capability, signified by tilde ~:

sbt projectName/clean; projectName/fastOptJS::startWebpackDevServer; ~projectName/fastOptJS::webpack

The file watchers should work as configured, or you can type "l" to trigger a reload manually