wilrib/README.md

## README.md

      
    Raw
  

              README.md
            
          
    This blogpost shows how to setup Rails 6 with Bootstrap 4.
This snippet shows a somehow different and less customized approach.
$ rails new rails6-bootstrap4
$ bundle --binstubs
$ yarn add bootstrap jquery popper.js

# config/webpack/environment.js

...
const webpack = require('webpack');
environment.plugins.append(
  'Provide',
  new webpack.ProvidePlugin({
    $: 'jquery',
    jQuery: 'jquery',
    Popper: ['popper.js', 'default'],
  }),
);

...

# app/javascript/packs/application.js

import 'bootstrap/dist/js/bootstrap';

# app/javascript/packs/styles.scss

@import '~bootstrap/scss/bootstrap';

# config/webpacker.yml

...
extract_css: true

# app/views/layouts/application.html.erb

<%= stylesheet_pack_tag 'styles', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
...
<body>
  <div class='container'>
    <%= yield %>
  </div>
</body>


$ bin/webpack-dev-server
$ bin/rails s