Home How to add Bootstrap to a Rails 6 project
Post
Cancel

How to add Bootstrap to a Rails 6 project

Create a new Rails 6 project.

1
$ rails new awesome-project

Add bootstrap, popper.js and jquery using yarn.

1
$ yarn add bootstrap popper.js jquery

Copy the snippet below into config/webpack/environment.js

1
2
3
4
5
6
const webpack = require('webpack')
environment.plugins.append('Provide', new webpack.ProvidePlugin({
  $: 'jquery',
  jQuery: 'jquery',
  Rails: '@rails/ujs'
}))

Rename the application.css in app/assets/stylesheets into application.scss and copy & paste the snippet below.

1
@import 'bootstrap/scss/bootstrap';
This post is licensed under CC BY 4.0 by the author.