如何在Play Framework 2.x中使用Twitter Bootstrap 2 [英] How to use Twitter Bootstrap 2 with play framework 2.x

查看:99
本文介绍了如何在Play Framework 2.x中使用Twitter Bootstrap 2的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我知道当前的Play!发行版具有Bootstrap 1.4的帮助程序.如果要使用当前版本的Bootstrap应该怎么办?

I know that current Play! distribution has a helper for Bootstrap 1.4. What should I do if I want to use the current version of Bootstrap?

推荐答案

我正在Play 2.0中使用2.0.1 Twitter引导程序.您可以在此处下载特定版本: https://github.com/twitter/bootstrap/tags .下载twitter引导程序后,您有两个选择:

I'm using the 2.0.1 twitter bootstrap with Play 2.0. You can download a specific version here: https://github.com/twitter/bootstrap/tags . Once you download the twitter bootstrap you have two options:

  • 您可以选择只使用bootstrap.min.css(和bootstrap-responsive.css)和bootstrap.min.js,所有这些文件都可以放置在公用文件夹中.

  • you can choose to just use the bootstrap.min.css (and bootstrap-responsive.css) and bootstrap.min.js, all these file can be placed in the public folder.

,或者您可以将较少的文件用于CSS.如果要使用较少的文件,请制作以下软件包(在您的应用文件夹的根目录中):

or you can use the less files for the css. If you want to use the less files you make the following package (in the root of your app folder):

assets.stylesheets.bootstrap

assets.stylesheets.bootstrap

在构建scala时,您定义应编译以下.less文件:

And in you build scala you define that these .less files should be compiled:

// 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" / "bootstrap" * "responsive.less") +++ 
    (base / "app" / "assets" / "stylesheets" * "*.less")
)

val main = PlayProject(appName, appVersion, appDependencies, mainLang = JAVA).settings(
  // Add your own project settings here
    lessEntryPoints <<= baseDirectory(customLessEntryPoints)
)

然后您可以将其包括在模板中:

And then you can include it in your templats:

<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap/bootstrap.min.css")" />
<link rel="stylesheet" media="screen" href="@routes.Assets.at("stylesheets/bootstrap/responsive.min.css")" />

2012-09-17: 如果您打算从源代码构建Play,请按照本教程的Play Wiki页面进行操作: https://github.com/playframework/Play20 /wiki/提示

2012-09-17: If you plan to build Play from source, follow this tutorial the Play wiki page: https://github.com/playframework/Play20/wiki/Tips

2012-09-21: 使用引导程序时,您始终必须选择是更改文件夹images还是向引导程序使用的两个静态映像添加路由:

2012-09-21: When using the bootstrap you always have to make a choice whether you would change the folder images or adding a route to the two static images used by the bootstrap:

2013-03-11: 正如外部参照指出的那样,我犯了一个错误:img必须为images:

2013-03-11: As xref pointed, I made a mistake: img must be images:

GET     /assets/img/glyphicons-halflings-white.png      controllers.Assets.at(path="/public", file="/images/glyphicons-halflings-white.png")
GET     /assets/img/glyphicons-halflings.png            controllers.Assets.at(path="/public", file="/images/glyphicons-halflings.png")

这篇关于如何在Play Framework 2.x中使用Twitter Bootstrap 2的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆