sbt-web, sbt-rjs and sbt-sass issues

Tom Biegeleisen

unread,

Sep 9, 2014, 4:00:16 PM9/9/14

to play-fr...@googlegroups.com

I'm running into a number of issues I'm not sure how to debug further without digging into the generated classes like target/src_managed/main/routes_routing.scala.

This is on Play 2.3.4 and sbt 0.13.5.

Here are the snippets from the relevant files:

build.sbt:

import com.typesafe.sbt.web.PathMapping
import com.typesafe.sbt.web.pipeline.Pipeline

version := "1.0-SNAPSHOT"

scalaVersion := "2.11.2"

lazy val hyperion = (project in file(".")).enablePlugins(PlayScala, SbtWeb)

// This enables asset pipeline fingerprinting (cache invalidation)
pipelineStages := Seq(rjs, digest)
// This will enable compass compiler for sass
sassOptions in Assets ++= Seq("--compass", "-r", "compass")

projects/plugins.sbt:

// Use the Play sbt plugin for Play projects
addSbtPlugin("com.typesafe.play" % "sbt-plugin" % "2.3.4")

// Add the plugin for SASS compilation
addSbtPlugin("default" % "sbt-sass" % "0.1.6")

// Add sbt-rjs, the requirejs optimizer
// See: https://github.com/sbt/sbt-rjs
addSbtPlugin("com.typesafe.sbt" % "sbt-rjs" % "1.0.5")

// Add sbt-digest, for asset fingerprinting
addSbtPlugin("com.typesafe.sbt" % "sbt-digest" % "1.0.0")

// Add sbt-gzip for compressing web assets
addSbtPlugin("com.typesafe.sbt" % "sbt-gzip" % "1.0.0")

// Add jshint plugin for javascript linting
addSbtPlugin("com.typesafe.sbt" % "sbt-jshint" % "1.0.1")

index.scala.html:

@(title: String)
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>@title</title>
    @helper.requireJs(core = routes.Assets.versioned("javascripts/require.js").url, module = routes.Assets.versioned("javascript/main").url)
</head>
<body></body>
</html>

1. The first issue is that I don't understand how sbt-rjs reorganizes routes. The template above is rendered as follows:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title></title>
  <script type="text/javascript" data-main="/assets/javascript/main" src="/assets/javascripts/require.js"></script>
</head>
<body></body>
</html>

The user agent cannot find the file main.js anywhere. Running find . -name "main.js" in the target directory returns the following:

./web/rjs/appdir/javascript/main.js

I've tried every combination of /assets/[javascript || javascripts || lib || appdir || main]/main.js but none of these routes point to the main.js file. There is some subtle rerouting happening here that is not documented.

Furthermore, running find . -name "require.js" in the target directory in our project returns the following:

./web/rjs/appdir/javascript/require.js
./web/rjs/appdir/lib/requirejs/require.js
./web/web-modules/main/webjars/lib/requirejs/require.js

I guess I don't really need to know because require.js is loading, but I'm not sure why there are three copies of it floating around. I'm also not understanding why require.js is loaded through the path javascripts but everything else (per play documentation) is supposed to be loaded through the path javascript. This seems like an odd distinction.

NB: Everything works great in dev mode. It's production mode that gets borked like this.

2. The second issue is that sbt-digest isn't working quite right with sbt-sass. It seems to be hashing the pre-compiled .scss files instead of the output .css files. The target/web/digest directory is filled with *.scss.md5 files. Any idea how to configure build.sbt to have the digest run after sass compilation?

3. The third issue is that sbt-digest isn't hashing any javascript files. I've tried adding includeFilter in digest := "*.js" to build.sbt but it is ignored. The only files that are correctly hashed at the moment are png files :-\

Any input would be appreciated! Thank you.

Tom Biegeleisen

unread,

Sep 24, 2014, 11:47:38 AM9/24/14

to play-fr...@googlegroups.com

For anyone interested, the issue was within sbt-sass. A patch has been released to address it: https://github.com/ShaggyYeti/sbt-sass/pull/13

I'm still unclear on why require.js is loaded through the path /assets/javascripts and everything else is /assets/javascript. If anyone has an answer, I'm still curious!

Cheers,

Christopher Hunt

unread,

Sep 24, 2014, 11:46:51 PM9/24/14

to play-fr...@googlegroups.com

On Wednesday, 10 September 2014 06:00:16 UTC+10, Tom Biegeleisen wrote:

index.scala.html:

@(title: String) <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>@title</title> @helper.requireJs(core = routes.Assets.versioned("javascripts/require.js").url, module = routes.Assets.versioned("javascript/main").url) </head> <body></body> </html>

Where are you getting the "@helper.requireJs" usage from? We now advocate:

Reply all

Reply to author

Forward