No mapping using babel and browserify in PlayFramework 2.5

Question

I am writing a project that is based on the seed at git@github.com:maximebourreau/play-reactjs-es6-seed.git

It appears to work with the 2.3 play framework, but I am getting errors using the 2.5 framework.

When I try to load a page, it get the following error:

RuntimeException: No mapping for /path/to/root/target/web/browserify/main.js

The full stack trace is at the bottom of the message.

This is the file that browserify is writing, but it seems that play does not know how to map it to a URL. I was not able to find anything that says where the file should be written or how to add a new mapping. I am also happy to use a plugin to do the translation.

Where should I be writing the file, or how should I tell play how to map the file?

My build.sbt is

name := """myProject"""

version := "1.0-SNAPSHOT"

lazy val root = (project in file(".")).enablePlugins(PlayJava)


scalaVersion := "2.11.7"

libraryDependencies ++= Seq(
  javaJdbc,
  cache,
  javaWs,
)

val browserifyTask = taskKey[Seq[File]]("Run browserify")

val browserifyOutputDir = settingKey[File]("Browserify output directory")

browserifyOutputDir := target.value / "web" / "browserify"

browserifyTask := {
  println("Running browserify");
  val outputFile = browserifyOutputDir.value / "main.js"
  browserifyOutputDir.value.mkdirs
  "./node_modules/.bin/browserify -t [ babelify --presets [ es2015 react ] ] app/assets/javascripts/main.jsx -o "+outputFile.getPath !;
  List(outputFile)
}

sourceGenerators in Assets <+= browserifyTask

resourceDirectories in Assets += browserifyOutputDir.value

My routes file is

# Routes
# This file defines all application routes (Higher priority routes first)
# ~~~~

# An example controller showing a sample home page
GET     /                           controllers.HomeController.index
# An example controller showing how to use dependency injection
GET     /count                      controllers.CountController.count

# Map static resources from the /public folder to the /assets URL path
GET     /assets/*file               controllers.Assets.versioned(path="/public", file: Asset)


POST    /assessment                 controllers.AsyncController.assessment

#
# Play can't find files in node_modules in 2.5+
#GET     /node_modules/*file         controllers.NodeModulesController.at(file)
#GET     /node_modules/*file         controllers.NodeModulesController.at(file: String)
GET     /node_modules/*file         controllers.NodeModulesController.versioned(file: String)
#GET     /node_modules/*file         controllers.Assets.versioned(path="/node_modules", file:Asset)

The stack trace is

 scala.sys.package$.error(package.scala:27)
 sbt.Mapper$$anonfun$fail$1.apply(PathMapper.scala:37)
 sbt.Mapper$$anonfun$fail$1.apply(PathMapper.scala:37)
 sbt.Alternatives$$anon$1$$anonfun$$bar$1$$anonfun$apply$3.apply(PathMapper.scala:117)
 sbt.Alternatives$$anon$1$$anonfun$$bar$1$$anonfun$apply$3.apply(PathMapper.scala:117)
 scala.Option.orElse(Option.scala:257)
 sbt.Alternatives$$anon$1$$anonfun$$bar$1.apply(PathMapper.scala:117)
 sbt.Alternatives$$anon$1$$anonfun$$bar$1.apply(PathMapper.scala:117)
 sbt.PathFinder$$anonfun$pair$1.apply(Path.scala:135)
 sbt.PathFinder$$anonfun$pair$1.apply(Path.scala:135)
 scala.collection.TraversableLike$$anonfun$flatMap$1.apply(TraversableLike.scala:251)
 scala.collection.TraversableLike$$anonfun$flatMap$1.apply(TraversableLike.scala:251)
 scala.collection.mutable.ResizableArray$class.foreach(ResizableArray.scala:59)
 scala.collection.mutable.ArrayBuffer.foreach(ArrayBuffer.scala:47)
 scala.collection.TraversableLike$class.flatMap(TraversableLike.scala:251)
 scala.collection.AbstractTraversable.flatMap(Traversable.scala:105)
 sbt.PathFinder.pair(Path.scala:135)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1$$anonfun$9$$anonfun$10$$anonfun$apply$4.apply(SbtJsTask.scala:292)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1$$anonfun$9$$anonfun$10$$anonfun$apply$4.apply(SbtJsTask.scala:286)
 com.typesafe.sbt.web.SbtWeb$.withActorRefFactory(SbtWeb.scala:595)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1$$anonfun$9$$anonfun$10.apply(SbtJsTask.scala:285)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1$$anonfun$9$$anonfun$10.apply(SbtJsTask.scala:284)
 scala.collection.immutable.Stream$$anonfun$map$1.apply(Stream.scala:376)
 scala.collection.immutable.Stream$$anonfun$map$1.apply(Stream.scala:376)
 scala.collection.immutable.Stream$Cons.tail(Stream.scala:1085)
 scala.collection.immutable.Stream$Cons.tail(Stream.scala:1077)
 scala.collection.immutable.Stream.foldLeft(Stream.scala:563)
 scala.concurrent.Future$.sequence(Future.scala:491)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1$$anonfun$9.apply(SbtJsTask.scala:303)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1$$anonfun$9.apply(SbtJsTask.scala:272)
 com.typesafe.sbt.web.incremental.package$.syncIncremental(package.scala:228)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1.apply(SbtJsTask.scala:271)
 com.typesafe.sbt.jse.SbtJsTask$$anonfun$jsSourceFileTask$1.apply(SbtJsTask.scala:257)
 scala.Function1$$anonfun$compose$1.apply(Function1.scala:47)
 sbt.$tilde$greater$$anonfun$$u2219$1.apply(TypeFunctions.scala:40)
 sbt.std.Transform$$anon$4.work(System.scala:63)
 sbt.Execute$$anonfun$submit$1$$anonfun$apply$1.apply(Execute.scala:228)
 sbt.Execute$$anonfun$submit$1$$anonfun$apply$1.apply(Execute.scala:228)
 sbt.ErrorHandling$.wideConvert(ErrorHandling.scala:17)
 sbt.Execute.work(Execute.scala:237)
 sbt.Execute$$anonfun$submit$1.apply(Execute.scala:228)
 sbt.Execute$$anonfun$submit$1.apply(Execute.scala:228)
 sbt.ConcurrentRestrictions$$anon$4$$anonfun$1.apply(ConcurrentRestrictions.scala:159)
 sbt.CompletionService$$anon$2.call(CompletionService.scala:28)
 java.util.concurrent.FutureTask.run(FutureTask.java:266)
 java.util.concurrent.Executors$RunnableAdapter.call(Executors.java:511)
 java.util.concurrent.FutureTask.run(FutureTask.java:266)
 java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1142)
 java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:617)
 java.lang.Thread.run(Thread.java:745)

Answer 1

I ran accross the same error message, and almost same stacktrace, after starting a project from the same git repo: git@github.com:maximebourreau/play-reactjs-es6-seed.git

The latest version of the repo is using play 2.5 and works fine, so I don't think play version is a problem.

I noticed that the error was mentioning [sbt-jshint] somewhere, and removing this line from project/plugins.sbt fixed the problem for me:

addSbtPlugin("com.typesafe.sbt" % "sbt-jshint" % "1.0.3")

Answer 2

You must change two lines in build.sbt

List(outputFile)  to Nil
and
resourceDirectories in Asset += browserifyOutputDir.value
to
unmanagedResources in Assets += baseDirectory.value / "target/web/browserify/main.js"

For example:

browserifyTask := {
  println("Running browserify");
  val outputFile = browserifyOutputDir.value / "main.js"
  browserifyOutputDir.value.mkdirs
  "./node_modules/.bin/browserify -t [ babelify --presets [ es2015 react ] ] app/assets/javascripts/main.jsx -o "+outputFile.getPath !;
  Nil
}

sourceGenerators in Assets <+= browserifyTask
unmanagedResources in Assets += baseDirectory.value / "target/web/browserify/main.js"