Skip to content

Instantly share code, notes, and snippets.

@chris-roerig
Last active February 17, 2021 14:07
Show Gist options
  • Save chris-roerig/86470a3db030f86cc8b3ded70e51fa10 to your computer and use it in GitHub Desktop.
Save chris-roerig/86470a3db030f86cc8b3ded70e51fa10 to your computer and use it in GitHub Desktop.
how to install bootstrap 4 in Rails 6 via webpacker
# thanks Recker Swartz - https://gorails.com/forum/install-bootstrap-with-webpack-with-rails-6-beta
Updated:
Rails 6 with Bootstrap and configured with Webpack
Step 1:
yarn add bootstrap jquery popper.js
Step 2:
in config/webpack/environment.js add the following:
const { environment } = require('@rails/webpacker')
const webpack = require('webpack')
environment.plugins.append('Provide', new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
Popper: ['popper.js', 'default']
}))
module.exports = environment
Step 3:
in app/javascript/packs/application.js add the following:
require("bootstrap/dist/js/bootstrap")
note: doesn't need to import jquery , popper once initialized as webpacker plugin
step 4:
in app/assets/stylesheets/application.css add the following:
@import "bootstrap/scss/bootstrap";
or
*= require bootstrap/scss/bootstrap
note: rails-sass can pick file from node modules
This get bootstrap 4 up and running with Rails 6 Beta and webpack!
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment