Instructions for setting up Bootstrap with Webpack and Phoenix 1.4

webpack_bootstrap_instructions.md

1. Install the following in assets:

npm install --save bootstrap jquery popper.js
npm install --save-dev [email protected] node-sass

2. Rename assets/app.css to assets/app.scss
3. Edit webpack.config.js to add sass-loader and enable scss compilation:

test: /\.(scss|css)$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']

4. Import bootstrap to app.scss:

@import '../node_modules/bootstrap/scss/bootstrap';

5. Import bootstrap in app.js and rename app.css to app.scss:

import css from "../css/app.scss"
import "bootstrap"