Skip to content

Instantly share code, notes, and snippets.

@abitdodgy
Last active October 22, 2019 19:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save abitdodgy/869ecd7748992622e4e871b0c28249cf to your computer and use it in GitHub Desktop.
Save abitdodgy/869ecd7748992622e4e871b0c28249cf to your computer and use it in GitHub Desktop.
Instructions for setting up Bootstrap with Webpack and Phoenix 1.4
  1. Install the following in assets:
npm install --save bootstrap jquery popper.js
npm install --save-dev sass-loader@7.3.1 node-sass
  1. Rename assets/app.css to assets/app.scss
  2. Edit webpack.config.js to add sass-loader and enable scss compilation:
test: /\.(scss|css)$/,
use: [MiniCssExtractPlugin.loader, 'css-loader', 'sass-loader']
  1. Import bootstrap to app.scss:
@import '../node_modules/bootstrap/scss/bootstrap';
  1. Import bootstrap in app.js and rename app.css to app.scss:
import css from "../css/app.scss"
import "bootstrap"
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment