rails 6 bootstrap jquery code example

Example: add bootstrap to rails 6

Works on rails 6 can confirm.


# Run this.
$yarn add bootstrap jquery popper.js

# Add this to your config/webpack/environment.js file.
const webpack = require('webpack')

environment.plugins.prepend(
    'Provide',
    new webpack.ProvidePlugin({
      $: 'jquery',
      jQuery: 'jquery',
      jquery: 'jquery',
      'window.jQuery': 'jquery',
      Popper: ['popper.js', 'default'],
    })
)

# Next add this to your application.js file.
require("bootstrap")
import "../../assets/stylesheets/application";
document.addEventListener("turbolinks:load", function() {
    $(function () {
        $('[data-toggle="tooltip"]').tooltip()
        $('[data-toggle="popover"]').popover()
    })
})

# Rename application.css to application.scss.
# Then simply import bootstrap. For me this path worked.
@import "bootstrap/scss/bootstrap";

# And if that doesn't work try.
@import "~bootstrap/scss/bootstrap";



# Hopefully you found this helpful
#~ Don't give up ~