What is it?
Programming on the Toilet is a document which contains tips, tricks, snippets or explanations about various programming technologies and paradigms, which could help developers in their everyday job. This episode was brought to you by Kenan Klisura, Lead Software Engineer at Atlantbh.
Bootstrap partial Sass
Bootstrap is a component-based library for developing web UI. Not all components are used when developing frontend with Bootstrap. In order to minimize the number of unused styles in a project, create a single sass file with custom imports of bootstrap components. Start with adding bootstrap as npm/yarn dependency, copy contents of a bootstrap.scss (defined in bootstrap/sass directory of node_modules) to a new file and change the imports path accordingly. The following is an example of the sass file that imports some bootstrap components:
// Import constants overrides
// Import bootstrap components
The ~ (tilde) is used for resolving from node_modules and is supported by sass-loader (webpack). For ember.js use ember-cli-bootstrap-sassy dependency, but without the tilde prefix.
Whenever you start a new project, start by using ESLint and adhere to its rules.
Want to share these tips in your workplace or at home? Download this episode of Programming on the Toilet here.