Tips - notbrain/Play20 GitHub Wiki
- Build Play from trunk (2.1-SNAPSHOT) (Since less version has been updated to 1.3)
- Copy bootstrap's less files into
app/assets/stylesheets/bootstrap - Add
bootstrap/_before eachbootstrap.lessimport declaration and rename each file the same way ( This is the convention to not compile theses files while packaging compiled assets ) - Move
bootstrap.lessfile intoapp/assets/stylesheets
This can be done with a script like this (run in app/assets/stylesheets/bootstrap)
for a in *.less; do mv $a _$a; done
sed -i 's|@import "|@import "bootstrap/_|' _bootstrap.less
mv _bootstrap.less ../bootstrap.less
sed -i 's|@import "|@import "bootstrap/_|' _responsive.less
mv _responsive.less ../bootstrap-responsive.less-
Copy bootstrap's less files into
app/assets/stylesheets/bootstrap -
Modify the
project/Build.scalafile to filter out the Bootstrap LESS files we don't want to compile: -
Define a new BuildPath resolver function:
// Only compile the bootstrap bootstrap.less file and any other *.less file in the stylesheets directory
def customLessEntryPoints(base: File): PathFinder = (
(base / "app" / "assets" / "stylesheets" / "bootstrap" * "bootstrap.less") +++
(base / "app" / "assets" / "stylesheets" * "*.less")
)Note: this will only compile stylesheets/bootstrap/bootstrap.less and stylesheets/*.less files. If you have any other LESS files in other subdirectories under stylesheets; adjust the function accordingly.
- Override the default
lessEntryPointssetting key with the new function:
val main = PlayProject(appName, appVersion, appDependencies, mainLang = JAVA).settings(
lessEntryPoints <<= baseDirectory(customLessEntryPoints)
)- Include the
bootstrap.min.cssfile in your view(s):
<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap/bootstrap.min.css")" />- Move the bootstrap 'img/' directory to somewhere in $PROJECT_ROOT/public/images/ and change
@iconSpritePathand@iconWhiteSpritePathin variables.less (or _variables.less) to point there.- For example, if you move the images to $PROJECT_ROOT/public/images/bootstrap/, the variables become:
@iconSpritePath: "/assets/images/bootstrap/glyphicons-halflings.png";
@iconWhiteSpritePath: "/assets/images/bootstrap/glyphicons-halflings-white.png";- Include all the JavaScript files. Run this from your assets directory to get the code necessary to include all of the JavaScript files. Add the output of this command to the bottom of your template, before the
</body>tag:
for i in `ls javascripts/*`; do echo '<script src="@routes.Assets.at("'$i'")"></script>' | sed 's/\.js/.min.js/g'; done- Be aware that Less 1.3 has a bug in it that means that if you have a subdirectory reference in a LESS file, you may get "charAt" errors (see https://github.com/cloudhead/less.js/issues/723 for more details).
When using Salat, make sure to disable SQL evolutions in your application.conf via evolutionplugin=disabled or you will run into inexplicable ClassCastExceptions.