简体   繁体   中英

GRAILS - How to start using Twitter Bootstrap in Grails 3.2.9 and what's the best way to do it?

What's the way to use Bootstrap in Grails 3.2.9? How to start? Should I use any plugins?

To follow best practices use the Grails Asset Pipeline . It may take a bit of practice to understand how the pipeline works but the general ideas are highlighted well in this SO Answer . The pipeline will create folders for your assets, (css, javascript, images for example) and you need to place your bootstrap files in the proper locations. Make sure you remember that Bootstrap requires jQuery.

Please note that all JavaScript plugins require jQuery ...

So be sure to include jQuery in your javascript folder. The other concept to grasp is creating the manifest file. For javascript assets it might look similar to:

Example file path:

grails-app/assets/javascripts/application.js

Example file contents:

//This is a JavaScript file with its top level require directives
//= require jquery
//= require app/models.js
//= require_tree views
//= require_self
console.log("This is my javascript manifest");

Then in the view you would like to uses the assets in, include the bootstrap assets by declaring:

<head>
    <asset:stylesheet href="application.css"/> //This assumes the standard pipeline path
    <asset:javascript src="application.js"/>
    <asset:link rel="shortcut icon" href="favicon.ico" type="image/x-icon"/>
</head>

Hopefully that helps you get started with loading Bootstrap via the asset pipeline.

You can use webjars

build.grade

dependencies {
    ...
    compile "org.webjars:bootstrap:3.3.5"
}

grails-app\\stylesheets\\application.css

*= require /webjars/bootstrap/3.3.5/css/bootstrap

grails-app\\javascripts\\application.js

//= require /webjars/bootstrap/3.3.5/js/bootstrap.min

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM