Install Bootstrap 4 Please note, Bootstrap 4 requires peer dependencies jquery and tether (for alpha) or popper.js (for beta+). Alpha instructions: npm –save install bootstrap@next jquery tether Beta+ instructions: npm –save install bootstrap@next jquery popper.js Create local Bootstrap 4 configuration We need to import base Bootstrap 4 configuration and be able to remove some components … Continue reading Webpack + Customizable Bootstrap 4.x (SCSS)
Foundation CSS Framework comes in two versions SCSS and Stylus. As example I will show here how to setup Stylus version. Let’s say you already have style-loader, css-loader, postcss-loader, postcss, postcss-flexbugs-fixes and autoprefixer installed. Install webpack plugins for stylus: npm install stylus stylus-loader –save-dev Install framework: npm install foundation –save Create directory src/foundation which will … Continue reading Webpack + Customizable Foundation 6.x (Stylus)
Install npm –save install bootstrap Create directory src/bootstrap Copy file from node_modules/bootstrap/less/bootstrap.less to src/bootstrap/bootstrap.less Fix import to begin with @import “~bootstrap/less/…”;. Add theme import @import “~bootstrap/less/theme.less”;. Add overrides, for example @import “variables.less”; and redefine @brand-primary. Create file src/bootstrap/bootstrap.js. Please refer to node_modules/bootstrap/dist/js/npm.js to find out what js modules could be used and in what order. … Continue reading Webpack + Customizable Bootstrap 3.x (LESS)
The goal: Get configurable Semantic UI without requirement to copy/paste all Semantic UI source code, ideally a way to enable/disable any components and override theme styles. Let’s say we have application folder structure: src/index.jsx package.json node_modules Assumptions Let’s assume that we would like to put all Semantic UI related overrides somewhere in project source folder, … Continue reading Webpack + Customizable Semantic UI 2.x (LESS)